javascript - jquery UI.js prevents to load dynamically loaded select menu -

-

i tried load dynamically loaded select menu page using ajax/php. jquery ui plugging prevents load dynamically loaded data. can't see nothing when change first select menu.

my code this.

<script> $(document).ready(function($) {   var list_target_id = 'list-target'; //first select list id   var list_select_id = 'list-select'; //second select list id   var initial_target_html = '<option value="">-select-</option>'; //initial prompt target select    $('#'+list_target_id).html(initial_target_html); //give target select prompt option    $('#'+list_select_id).change(function(e) {     //grab chosen value on first select list change     var selectvalue = $(this).val();      //display 'loading' status in target select list     $('#'+list_target_id).html('<option value="">loading...</option>');      if (selectvalue == "") {         //display initial prompt in target select if blank value selected        $('#'+list_target_id).html(initial_target_html);     } else {       //make ajax request, using selected value       $.ajax({url: 'loadcity.php?svalue='+selectvalue,              success: function(output) {                 //alert(output);                 $('#'+list_target_id).html(output);             },           error: function (xhr, ajaxoptions, thrownerror) {             alert(xhr.status + " "+ thrownerror);           }});         }     }); }); </script>  <form method="post"> <div class="select-country"> <label>district</label> <select name="list-select" id="list-select"> <option value="">please select..</option> <?php $sel_dis2 = mysql_query("select * district", $connection); confirm_query($sel_dis2); while($dis2 = mysql_fetch_assoc($sel_dis2)){ ?> <option value="<?php echo $dis2["id_district"]; ?>"><?php echo $dis2["district"]; ?></option> <?php } ?> </select> </div> <div class="select-state"> <label>city</label>  <select name="list-target" id="list-target"></select> </div> </form>

i tested code without including jquery ui , worked properly. want add jquery ui page. php file

<?php $connection = mysqli_connect("localhost", "user", "password", "database");  $selectvalue = mysqli_real_escape_string($connection, $_get['svalue']);  mysqli_select_db($connection, "database"); $result = mysqli_query($connection, "select city.id_city, city.city  city city.district_id = '$selectvalue'");  echo '<option value="">-select-</option>'; while($row = mysqli_fetch_array($result))   {     echo '<option value="'.$row['id_city'].'">' . $row['city'] . "</option>";     //echo $row['drink_type'] ."<br/>";   }  mysqli_free_result($result); mysqli_close($connection);  ?>

something else breaking select. tested @ jsfiddle: https://jsfiddle.net/ddpdhr5a/

$(document).ready(function($) {    var list_target_id = 'list-target'; //first select list id    var list_select_id = 'list-select'; //second select list id    var initial_target_html = '<option value="">-select-</option>'; //initial prompt target select      $('#'+list_target_id).html(initial_target_html); //give target select prompt option      $('#'+list_select_id).change(function(e) {      //grab chosen value on first select list change      var selectvalue = $(this).val();        //display 'loading' status in target select list      $('#'+list_target_id).html('<option value="">loading...</option>');        if (selectvalue == "") {          //display initial prompt in target select if blank value selected         $('#'+list_target_id).html(initial_target_html);      } else {        //make ajax request, using selected value        $.ajax({url: 'loadcity.php?svalue='+selectvalue,               success: function(output) {                  //alert(output);                  $('#'+list_target_id).html(output);              },            error: function (xhr, ajaxoptions, thrownerror) {              alert(xhr.status + " "+ thrownerror);            }});          }      });  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <script src="http://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script>    <form method="post">  <div class="select-country">  <label>district</label>  <select name="list-select" id="list-select">  <option value="">please select..</option>  <option value="something">something</option>  </select>  </div>  <div class="select-state">  <label>city</label>   <select name="list-target" id="list-target"></select>  </div>  </form>

this seems work perfectly, although had remove php, naturally, , use mock location


Comments

Post a Comment

Popular posts from this blog

php - How to display all orders for a single product showing the most recent first? Woocommerce -

-
i have password protected page on frontend. on page, want display full list of purchases associated single woocommerce product id. option 1: i've looked through woocommerce docs , , found: wc_cli_order , list_( $args, $assoc_args ) function lists orders. presumably, orders can filtered product id [--=] filter orders based on order property. line item fields (numeric array, started index zero): line_items.0.product_id option 2: i found article , based on customer id. i've modified code based on guesses meta_key , meta_value. $customer_orders = get_posts( array( 'numberposts' => -1, 'meta_key' => '_product', 'meta_value' => get_product_id(), 'post_type' => wc_get_order_types(), 'post_status' => array_keys( wc_get_order_statuses() ), ) ); how display orders single product showing recent order first? here solution put based on these articles: http://www.w...
Read more

asp.net - How to correctly use QUERY_STRING in ISAPI rewrite? -

-
i'm having difficult time , hope guys can help. using helicon isapi rewrite version 3.1.0.104 on our iis server. edit http.conf file , have tried , still fail. this trying do: redirect url: https://www.domain.com/switch-by-version?version=2.8.5.2594 to: https://test.domain.com/load/load.aspx?tver=2.8.5.2594 the version number @ end source url change, , need target url have same version number @ end of url example above shows. i tried following not work: rewritecond %{query_string} ^version=(\d\d?)\.(\d\d?)\.(\d\d?)\.(.*)$ [nc] rewriterule ^/switch-by-version(.*)$ https://test.domain.com/load/load.aspx?tver=%1 [r=307,nc,l] any appreciated! thanks. if it's running in equivalent context of .htaccess , rule shouldn't start / . here's simpler version: rewritecond %{query_string} ^version=(\d+\.\d+\.\d+(?:\..+)?)$ [nc] rewriterule ^switch-by-version/?$ https://test.domain.com/load/load.aspx?tver=%1 [r=307,nc,l]
Read more

angularjs - How restrict admin panel using in backend laravel and admin panel on angular? -

-
https://scotch.io/tutorials/token-based-authentication-for-angularjs-and-laravel-apps following tutorials, try write authentication restrict admin panel, didn't understood how can that. this admin panel, admin panel don't want show , request database unauthenticated users. my laravel-routes route::get('/admin',function(){ return view('index'); }); route::get('/api/v1/employees/{id?}', 'employees@index'); route::get('/api/v1/users/{id?}', 'employees@users'); route::post('/api/v1/employees', 'employees@store'); route::post('/api/v1/employees/{id}', 'employees@update'); route::delete('/api/v1/employees/{id}', 'employees@destroy'); route::group(['prefix' => 'api'], function() { route::resource('authenticate', 'authenticatecontroller', ['only' => ['index']]); route::post('authenticate', 'authentic...
Read more