javascript - Not getting onchange event of dynamicly added dropdown in mvc3 -


i have 3 dropdownlists.

$(document).ready(function () {         $("#dropdownlist1").change(function () {             $("#id1").val($(this).val());             $("#name1").val($("#dropdownlist1 option:selected").text());             $('#div1').load('/account/dropdown2/?id1=' + $("#id1").val());          });         $("#dropdownlist2").change(function () {             $("#routeid").val($(this).val());             $("#routename").val($("#routedropdownlist option:selected").text());             $('#div2').load('/account/dropdown3/?id2=' + $("#routeid").val());           });         $("#dropdownlist3").change(function () {             $("#id3").val($(this).val());             $("#name3").val($("#dropdownlist3 option:selected").text());           });     }); 

in dropdownlist2 , dropdownlist3 added dynamicly.the problem dynamicly added dropdowns not got registered in page .so not getting selected value onchange event.i added these controls partial view. controller.

public actionresult dropdownlist2 (string id1)         {             list<emp> emplist = new list<emp>();             emp em= new emp ()             {                 id = "1",                 name = "doac"             };                         emplist .add(em);                         viewbag.dropdownlist2= new selectlist(emplist , "id", "name");             return partialview();         } 

generated html

<script type="text/javascript">     $('#createsubscriber').removeclass('menuholderli').addclass('selectedmenu');     $(document).ready(function () {         $("#dropdownlist").change(function () {             $("#organization_id").val($(this).val());             $("#organization_name").val($("#dropdownlist option:selected").text());             $('#routediv').load('/account/routedropdown/?organizationid=' + $("#organization_id").val());          });         $(document).on('change', "#routedropdownlist", function () {             alert("hi");             $("#routeid").val($(this).val());             $("#routename").val($("#routedropdownlist option:selected").text());             $('#locationdiv').load('/account/locationdropdown/?routeid=' + $("#routeid").val());          });         $("#locationdropdownlist").change(function () {             $("#locationid").val($(this).val());             $("#locationname").val($("#locationdropdownlist option:selected").text());           });     }); </script> <p class="message-info">     passwords required minimum of 6 characters in length. </p>  <script src="/scripts/jquery.validate.min.js"></script> <script src="/scripts/jquery.validate.unobtrusive.min.js"></script>  <form action="/account/register" method="post">    <fieldset>         <legend>registration form</legend>         <ol>             <li>                  <label for="organization_name">name</label>                 <input id="organization_id" name="organization.id" type="hidden" value="" />                 <input id="organization_name" name="organization.name" type="hidden" value="" />                  <select id="dropdownlist" name="dropdownlist"><option value="">---select---</option> <option value="516c0a18c891870f107aa74a">choice school</option> <option value="516d277bc8918701a44c131e">new org</option> <option value="516d1f492e6bba07dc245cc7">olive</option> </select>                 <span class="field-validation-valid" data-valmsg-for="organization.name" data-valmsg-replace="true"></span>             </li>         </ol>          <div id="routediv"></div>         <div id="locationdiv"></div> 

use jquery .on()

$(document).on('change', "#dropdownlist2", function(){your code}) 

repeat dropdown 3


Comments

Popular posts from this blog

java - Jmockit String final length method mocking Issue -

asp.net - Razor Page Hosted on IIS 6 Fails Every Morning -

c++ - wxwidget compiling on windows command prompt -