Databases
StackOverflow2013
Postsdbo
POjQuery Chained Select Ajax - help needed
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery Chained Select Ajax - help needed
    primarykey
    data
    text
    <p>I recently posted my question <a href="https://stackoverflow.com/questions/5223777/jquery-to-update-select-list-not-like-the-other-questions">see previous question</a> and received a great working solution but when I applied the solution to my code, I found that if there was any html tags between the two selects, the second select list would not update. My guess is that the .next was not finding the class I was searching for. </p> <pre><code>&lt;cfloop query="rsRequestSystems"&gt; &lt;tr&gt; &lt;td&gt;&lt;select class="platform" name="platform" id="platform"&gt; &lt;option&gt;&lt;/option&gt; &lt;cfloop query="rsPlatform"&gt; &lt;option value="#rsPlatform.optionValue#" &lt;cfif rsRequestSystems.platform eq rsPlatform.optionValue&gt;selected&lt;/cfif&gt;&gt;#rsPlatform.optionDesc#&lt;/option&gt; &lt;/cfloop&gt; &lt;/select&gt;&lt;/td&gt; &lt;td&gt;&lt;select name="model" id="model"&gt; &lt;option&gt;&lt;/option&gt; &lt;cfloop query="rsModels"&gt; &lt;option value="#rsModels.optionValue#" &lt;cfif rsRequestSystems.model eq rsModels.optionValue&gt;selected&lt;/cfif&gt;&gt;#rsModels.optionDesc#&lt;/option&gt; &lt;/cfloop&gt; &lt;/select&gt;&lt;/td&gt; &lt;/tr&gt; </code></pre> <p></p> <p>and the jQuery code is:</p> <pre><code>$(".platform").live("change", function() { var firstOption = $(this); $.getJSON("index.cfm?do=misc.getModels",{platform: $(this).val()}, function(j){ var options = ''; for (var i = 0; i &lt; j.length; i++) { options += '&lt;option value="' + j[i].optionValue + '"&gt;' + j[i].optionDisplay + '&lt;/option&gt;'; } firstOption.next("#model").html(options); }); }); </code></pre> <p>and here is a sample of the json data being returned:</p> <pre><code>[{"optionValue":"", "optionDisplay":"Select Model"},] </code></pre>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USCommunity
    1. USHPWD
    plurals
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. COI should add that rows can be dynamically added and therefore I cannot rely on unique IDs. The idea is that the user will populate the form by adding the necessary systems and then submit one large form. It is not the preferred way to do this, I know, but I'm working with requirements. There could easily be 100+ systems and the client doesn't want the end user to have to wait for the page to refresh as the systems are added before the final submit.
      singulars
      1. POjQuery Chained Select Ajax - help needed
      1. USHPWD
    2. COI cannot rely on unique ID's, unfortunately. If I were to verbally walk through this, I would say, "When the .platform changes, I need to find the parent table containing the select.platform that was changed, and then update the select.models with the results from the ajax call."
      singulars
      1. POjQuery Chained Select Ajax - help needed
      1. USHPWD
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

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