Friday, December 3, 2021

Any autocomplete box with select dropdown

 Any autocomplete dropdown, use this code

$(document).ready(function () {

    var orgid = "0";

    getSeverityList(orgid);

    var $advAutoComplete = $('#addForm87 input[name="orgs_id"]');

    $advAutoComplete.each(function()

    {

      var $el = $(this);

      $el.on( "autocompletechange", function( event, ui )

      {

          orgid = $(event.target).attr('data-selectedid');

          getSeverityList(orgid);

      });

    });

 });


Html is like this

<div style="" class="mui-textfield ui-front mui-col-md-6">
                                    <input name="orgs_id" class="autoCompCollAdv mui--is-empty ui-autocomplete-input mui--is-dirty" type="text" data-returnpropname="orgs_id" data-coll="12" data-alias="o" data-columns="{'ValueProperty':'_id', 'DisplayProperties':['_id','name'], 'FilterDBCols':['_id','name'], 'RunOnFocus':'true', 'Functions':{'Focus':'FocusFunc','Type':'TypeFunc'}, 'PermDBFilters':[] }" value="" data-modalid="addModel87" required="" data-dirty="0" data-selectedid="" autocomplete="off" data-oldval="">
                                    <label class="">Customer ID</label>
  </div>




run any ajax oj js function when bootstrap modal open

For any bootstrap modal open, these are by default class. These classes are not mention but this is worked.   

bs modal

These are default class.

js code for call when modal is open.

$(document).ready(function () {

$( '#editModel87' ).on('show.bs.modal', function(){

  //alert("I want this to appear after the modal has opened!");

  setTimeout(

    function() {

      var orgsid = $('#editForm87 input[name="orgs_id"]').attr('data-selectedid');

      var ticketId = $('#editForm87 input[name="key_id"]').val();

      getSeverityListEdit(orgsid,ticketId);

    }, 3000); // run after 3 seconds

  });

});