Databases
StackOverflow2013
Postsdbo
POjQuery val() returning previously selected element value
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery val() returning previously selected element value
    text
    copied!<p>I have a javascript function that handle dynamic IDs from a table.</p> <p>TABLE:</p> <pre><code>&lt;table border = "0" width = "95%" class = "table table-striped table-bordered" id = "tblInfoChecks"&gt; &lt;thead&gt; &lt;tr&gt; &lt;th&gt;&lt;center&gt;#&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;Category&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;Name&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;Date&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;Due Date&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;Allocation&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;Status&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;TAT&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;Action&lt;/center&gt;&lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;tbody&gt; &lt;?php $q = "SELECT * FROM checks WHERE candidate_id = '$case_id' AND client_id = '$client_id'"; $res = mysql_query($q); $numR = mysql_numrows($res); $y = 0; while($y &lt; $numR){ $m = $y + 1; $check_id = mysql_result($res, $y, "case_id"); $check_name = mysql_result($res, $y, "check_name"); //hidden $check_cat = mysql_result($res, $y, "check_category"); //hidden $elements = mysql_result($res, $y, "elements"); //hidden //verified information -- hidden $ver_status = mysql_result($res, $y, "ver_status"); $ver_remarks = mysql_result($res, $y, "ver_remarks"); $ver_action = mysql_result($res, $y, "ver_action"); $overall_status = mysql_result($res, $y, "overall_status"); $check_date = mysql_result($res, $y, "date_to_process"); $check_due_date = mysql_result($res, $y, "due_date"); $ver_id = mysql_result($res, $y, "verifier_id"); $check_status = mysql_result($res, $y, "status"); //hidden elements echo '&lt;input type = "text" style = "" id = "txtInfoCheckID'.$y.'" value = "'.$check_id.'" /&gt;'; echo '&lt;input type = "text" style = "" id = "txtInfoCheckName'.$y.'" value = "'.$check_name.'" /&gt;'; echo '&lt;input type = "text" style = "" id = "txtInfoCheckCat'.$y.'" value = "'.$check_cat.'" /&gt;'; echo '&lt;input type = "text" style = "" id = "txtInfoCheckElements'.$y.'" value = "'.$elements.'" /&gt;'; echo '&lt;input type = "text" style = "" id = "txtInfoCheckVerStatus'.$y.'" value = "'.$ver_status.'" /&gt;'; echo '&lt;input type = "text" style = "" id = "txtInfoCheckVerRemarks'.$y.'" value = "'.$ver_remarks.'" /&gt;'; echo '&lt;input type = "text" style = "" id = "txtInfoCheckVerAction'.$y.'" value = "'.$ver_action.'" /&gt;'; echo '&lt;input type = "text" style = "" id = "txtInfoCheckOverallStatus'.$y.'" value = "'.$overall_status.'" /&gt;'; //get verifier name $ver = "SELECT name FROM employees WHERE id = '$ver_id'"; $ver_res = mysql_query($ver); $ver_numR = mysql_numrows($ver_res); if($ver_numR != 0){ $ver_name = mysql_result($ver_res, 0 ,0); } //compute TAT $check_date_sec = strtotime($check_date); $today = strtotime(date("m/d/Y", time())); $tat = $today - $check_date_sec; $time_arr = secondsToTime($tat); $final_tat = $time_arr["d"]; //tat echo ' &lt;tr&gt; &lt;td&gt;&lt;center&gt;'.$m.'&lt;/center&gt;&lt;/td&gt; &lt;td&gt;&lt;center&gt;'.$check_cat.'&lt;/center&gt;&lt;/td&gt; &lt;td&gt;&lt;center&gt;'.$check_name.'&lt;/center&gt;&lt;/td&gt; &lt;td&gt;&lt;center&gt;'.$check_date.'&lt;/center&gt;&lt;/td&gt; &lt;td&gt;&lt;center&gt;'.$check_due_date.'&lt;/center&gt;&lt;/td&gt; &lt;td&gt;&lt;center&gt;'.$ver_name.'&lt;/center&gt;&lt;/td&gt; &lt;td&gt;&lt;center&gt;'.$check_status.'&lt;/center&gt;&lt;/td&gt; &lt;td&gt;&lt;center&gt;'.$final_tat.'&lt;/center&gt;&lt;/td&gt; &lt;td&gt;&lt;center&gt;&lt;a href = "javascript: void(0);" id = "viewInfoCheckElements'.$y.'"&gt;View Elements&lt;/a&gt;&lt;/center&gt;&lt;/td&gt; &lt;/tr&gt; '; $y++; } ?&gt; &lt;/tbody&gt; &lt;tfoot&gt; &lt;tr&gt; &lt;th&gt;&lt;center&gt;#&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;Category&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;Name&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;Date&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;Due Date&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;Allocation&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;Status&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;TAT&lt;/center&gt;&lt;/th&gt; &lt;th&gt;&lt;center&gt;Action&lt;/center&gt;&lt;/th&gt; &lt;/tr&gt; &lt;/tfoot&gt; &lt;/table&gt; </code></pre> <p>JS</p> <pre><code>var rowCount_infoChecks = $('#tblInfoChecks &gt;tbody &gt;tr').length; for(var i = 0; i &lt; rowCount_infoChecks; i++) {ViewInfoChecks(i);} </code></pre> <p>ViewInfoChecks:</p> <pre><code>function ViewInfoChecks(place){ $('#viewInfoCheckElements'+place).livequery(function(){ $('#viewInfoCheckElements'+place).live("click", function(e){ var check_id = $('#txtInfoCheckID'+place).val(); alert(check_id); var check_name = $('#txtInfoCheckName'+place).val(); var check_cat = $('#txtInfoCheckCat'+place).val(); var check_elem = $('#txtInfoCheckElements'+place).val(); var ver_status = $('#txtInfoCheckVerStatus'+place).val(); var ver_remarks = $('#txtInfoCheckVerRemarks'+place).val(); var ver_action = $('#txtInfoCheckVerAction'+place).val(); var overall_status = $('#txtInfoCheckOverallStatus'+place).val(); $.post( "posts/view-check-elements.php", { check_name : check_name, check_cat : check_cat, check_elem : check_elem, ver_status : ver_status, ver_remarks : ver_remarks, ver_action : ver_action, overall_status : overall_status }, function(data){ $('#popupViewInfoChecks').html(data); $('#popupViewInfoChecks').lightbox_me({ centered: true }); e.preventDefault(); } ); }); }); } </code></pre> <p>Every time I load the table to a div element using <code>$('#').html(data);</code> it loaded properly and I try to unhide the hidden values and the element values are properly placed. But when I access it through a <code>$('#').val()</code> and alert the values it becomes inconsistent. Sometimes when I access the element the previous selected value is the one that is appearing so my assumption is it is related to the browser but when I try to clear the cache it still appearing so I think the problem is my code. </p> <p>Example:</p> <ul> <li>The value of the input selector with ID myID0 is "boy";</li> <li>I alert the value of myID0 and the value boy is correct</li> <li>I try to load the table again and query different values so the boy becomes girl</li> <li>I alert the value of the same selector myID0, the value is still boy and the newly assigned value(girl) was not recognized by the selector myID0.val();</li> </ul>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload