开发者

how to show or display the newly changed text field value instead of default value using jquery ajax method?

开发者 https://www.devze.com 2023-04-09 06:02 出处:网络
Here is my code, This is my form part, this is basically divided into two main actions using jquery, 1) First action :, Based on Selection

Here is my code,

This is my form part, this is basically divided into two main actions using jquery,

1) First action :, Based on Selection from :'Academic Year' selection, 'Course' selection & 'Class' selection , i used jquery ajax post method to load data from DB to All 5 set of IDs. .... Hey this part work Fine..

2) [my probs comes here -->], Second Action :, when i select anyone of IDs, it shud show or display new value of text box instead of default value, based on data from DB by using similar ajax post method

========================================================================

<form name="aone" id="aone" action="mattendance.php" method="POST" enctype="multipart/form-data">
   <div>                                                   <div style='padding-top:20px;'>
    Academic Year :&nbsp;&nbsp;
           <select name="academic" id="academic">
        <option value="0"> --- Select ---- </option>
            <option value="1990-91">1990-91 </option>
        <option value="1991-92">1991-92 </option>
        <option value="1992-93">1992-93 </option>
        <option value="1993-94">1993-94 </option>
        <option value="1994-95">1994-95 </option>
        <option value="1995-96">1995-96 </option>
        <option value="1996-97">1996-97 </option>
        <option value="1997-98">1997-98 </option>
        <option value="1998-99">1998-99 </option>
        <option value="1999-00">1999-00 </option>
        <option value="2000-01">2000-01 </option>
        <option value="2001-02">2001-02 </option>
        <option value="2002-03">2002-03 </option>
        <option value="2003-04">2003-04 </option>
        <option value="2004-05">2004-05 </option>
        <option value="2005-06">2005-06 </option>
        <option value="2006-07">2006-07 </option>
        <option value="2007-08">2007-08 </option>
        <option value="2008-09">2008-09 </option>
        <option value="2009-10">2009-10 </option>
        <option value="2010-11">2010-11 </option>
        <option value="2011-12">2011-12 </option>
        <option value="2012-13">2012-13 </option>
        <option value="2013-14">2013-14 </option>
        <option value="2014-15">2014-15 </option>
        <option value="2015-16">2015-16 </option>
        <option value="2016-17">2016-17 </option>
        <option value="2017-18">2017-18 </option>
        <option value="2018-19">2018-19 </option>
        <option value="2019-20">2019-20 </option>
        </select>                           
       </div>
       <div style='padding-top:15px;'>
        <label>Select Course :  </label>
         &nbsp;&nbsp;&nbsp;<input type="radio" name="course" class="course" value="SDC">SDC &nbsp;&nbsp;
                           <input type="radio" name="course" class="course" value="GDC" checked="defaultChecked" />GDC                      
        </div>
        <div style='padding-top:15px;'>
        <label>Select Class :  </label>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" name="first" id="first" value="I Year" >I Year&nbsp;&nbsp;
            <input type="checkbox" name="second" id="second" value="II Year">II Year&nbsp;&nbsp;
            <input type="checkbox" name="third" id="third" value="III Year">III Year    
        </div>
        <div style='padding-top:25px;'>
         <label> Date : </label>&nbsp;&nbsp;&nbsp;&nbsp;    
           <span class="demo">
            <input type="text" name="date" class="datepicker">
           </span>&nbsp;&nbsp;
           <span> FN :&nbsp;<input type='checkbox' name='actfnone' value='0'> </span>
           <span > AN :&nbsp;<input type='checkbox' name='actanone' value='0'> </span>  
         </div>                             
         <div style='padding-top:10px;'>
        <div style='padding-top:5px;'>
            ID No: 1 <span style="padding-left:10px;"> <select name="sId1" class="sId" onchange="Javascript: callone(this.options[this.selectedIndex].value);"> </select> </span><span> <input type="text" id="nameone" value=""> </span>
        </div>
        <div style='padding-top:5px;'>
            ID No: 2 <span style="padding-left:10px;"> <select name="sId2" class="sId" onchange="Javascript: calltwo(this.options[this.selectedIndex].value);"> </select>  </span><span > <input type="text" id="nametwo" value=""> </span>
        </div>
        <div style='padding-top:5px;'>
            ID No: 3 <span style="padding-left:10px;"> <select name="sId3" class="sId" onchange="Javascript: callthree(this.options[this.selectedIndex].value);"> </select></span><span > <input type="text" id="namethree" value=""> </span>
        </div>
        <div style='padding-top:5px;'>
            ID No: 4 <span style="padding-left:10px;"> <select name="sId4" class="sId" onchange="Javascript: callfour(this.options[this.selectedIndex].value);"> </select> </span><span > <input type="text" id="namefour" value=""> </span>
        </div>
        <div style='padding-top:5px;'>
            ID No: 5 <span style="padding-left:10px;"> <select name="sId5" class="sId" onchange="Javascript: callfive(this.options[this.selectedIndex].value);"> </select> </span> <span > <input type="text" id="namefive" value=""> </span>
        </div>
        </div>            
    </div>
    <p align="center">
    <input type="submit" value="SUBMIT" onclick="javascript: return ATcheck()" > 
    <input type="hidden" name="add" value="add" />          
    </p>
</form>

Jquery Area [Works fine] :

Action Part one :

<script>
    function popfield(acyr,crs,cls) {          
      $.ajax({  
         type : "POST",
         url  : "mattendance.php",
         cache: false,
   data : "academic="+ acyr +"&course="+ crs +"&class="+ cls,                                                   success: function(data) {                 
          $(".sId").html(data).show();                
         }             
     });            
        }   

$("#aone").ready(function() {     


    $("#academic").change(function () {
        var acval = $(this).find("option:selected").text();             
    });

    $("input:radio[name=course]").click(function() {
        var csval = $('input[name=course]:checked', '#aone').val();             
    });     

    $("#first").click(function () {
        if ($("#first").is(":checked")) {
            var sclass = $('input[name=first]:checked').val();                  
            $(":checkbox").click(popfield($("#academic").find("option:selected").text(),$('input[name=course]:checked', '#aone').val(),$('input[name=first]:checked').val()));                                        开发者_Go百科              
        }                                   
    });

    $("#second").click(function () {
        if ($("#second").is(":checked")) {
            var sclass = $('input[name=second]:checked').val();                                     
            $(":checkbox").click(popfield($("#academic").find("option:selected").text(),$('input[name=course]:checked', '#aone').val(),$('input[name=second]:checked').val()));                             
        }                                   
    });

    $("#third").click(function () {
        if ($("#third").is(":checked")) {
            var sclass = $('input[name=third]:checked').val();                                      
            $(":checkbox").click(popfield($("#academic").find("option:selected").text(),$('input[name=course]:checked', '#aone').val(),$('input[name=third]:checked').val()));                      
        }                                   
    }); 

});

Action Part two [Problem is here] :

function callone(sid) {

    alert('alert one :'+ sid);

    var dataString = "Id="+ sid ;

       $.ajax({         
     type : "POST",
     url  : "mattendance.php",
     data : dataString,             
    success: function(data) {                 
      $("#nameone").html(data);               
     }             
       }); 
   }                            }

[PHP part for Action Two :]

<?

// Call to Names from Ajax 
 if($_POST["Id"]!="")
  {        
   $dbselect=mysql_query("SELECT * FROM `tblNewStudent` WHERE `IdNo`='".$_POST["Id"]."' ORDER BY `SNo` ASC ");         
   $row = mysql_fetch_object($dbselect);
    print $row->Name;                 
   }

?>

I tried alot by seeing examples but cant able to display new value in text field n got wierd , seriously looking forward to ur best answers..

Thanks in Advance , {Raymond Herbert}


Try using following

$('#nameone').val(data);

instaed of

$("#nameone").html(data);
0

精彩评论

暂无评论...
验证码 换一张
取 消