EasyUI Forum

Hello,
I am trying to have a combobox run the remote lookup immediately after the form is loaded. Unfortunately, the q parameter is not passed after the form is loaded on the initial lookup. Is there a better way to do this? Here is an example of my code thus far:


      $(function()
      {
            $('#myForm').form(
         { 
                onLoadSuccess:function(data)
            { 
               
               //load combos
               $('#patient_id').combobox('reload', '/wservice/?_COMMAND=patient.lookup&q=' + $('#patient_id').combobox('getValue'));
               $('#physician_id').combobox('reload', '/wservice/?_COMMAND=personnel.lookup&q=' + $('#physician_id').combobox('getValue'));
               $('#facility_id').combobox('reload', '/wservice/?_COMMAND=facility.lookup&q=' + $('#facility_id').combobox('getValue'));
               $('#site_id').combobox('reload', '/wservice/?_COMMAND=site.lookup&q=' + $('#site_id').combobox('getValue'));
                },
                onLoadError:function()
            { 
               //display error
               alert('There was an error.');
                           
               //close the current form
               doClose_frmCaseMainRecord();
                }             
            });
      });





                <div class="myform">
                    <label for="patient_id">Patient:</label>
                    <select
                        id="patient_id"
                        name="patient_id"
                        class="easyui-combobox"                                 
                        data-options="
                            url:'/wservice/?_COMMAND=patient.lookup',
                            valueField:'id',
                            textField:'name',
                            mode:'remote',
                            disabled:true,
                            hasDownArrow:false"
                        style="
                            width:200px;"
                        />                                                                                                                 
                </div>
               
                <div class="myform">
                    <label for="physician_id">Surgeon:</label>
                    <select
                        id="physician_id"
                        name="physician_id"
                        class="easyui-combobox"                                 
                        data-options="
                            url:'/wservice/?_COMMAND=personnel.lookup',
                            valueField:'id',
                            textField:'name',
                            mode:'remote',
                            disabled:true,
                            hasDownArrow:false"
                        style="
                            width:200px;"
                        />                                                                                                                 
                </div>
               
                <div class="myform">
                    <label for="facility_id">Facility:</label>
                    <select
                        id="facility_id"
                        name="facility_id"
                        class="easyui-combobox"                                 
                        data-options="
                            url:'/wservice/?_COMMAND=facility.lookup',
                            valueField:'id',
                            textField:'name',
                            mode:'remote',
                            disabled:true,
                            hasDownArrow:false"
                        style="
                            width:200px;"
                        />                                                                                                                 
                </div>
               
                <div class="myform">
                    <label for="site_id">Site:</label>
                    <select
                        id="site_id"
                        name="site_id"
                        class="easyui-combobox"                                 
                        data-options="
                            url:'/wservice/?_COMMAND=site.lookup',
                            valueField:'id',
                            textField:'name',
                            mode:'remote',
                            disabled:true,
                            hasDownArrow:false"
                        style="
                            width:200px;"
                        />                                                                                                                 
                </div>

Please confirm if the selector $('#myForm') is correct and if the 'onLoadSuccess' is triggered.

Hello,

The HTML code marked in blue is wrapped in a form with the id "myForm". Please excuse the class attribute that is set to the same value.

The $('#myForm') selector for the form is correct and the is successfully being populated with a JSON response from the server that triggers the "onLoadSuccess" function in the green code.

Best

Please refer to the attached example that shows how to use 'reload' method to load the combobox's new items.

Hello,

I appreciate the example that you provided. It replicates, almost exactly, the functionality I have created above. Is there anyway to automate this functionality so that 'q' is passed to the webservice when the reload method is called?

$('#patient_id').combobox('reload'); //can q be set to getValue and passed to the webservice when this method is called

Best

Please try the following code.

Hello,

That works great! Thanks for your help. The example looks like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
   <meta name="keywords" content="jquery,ui,easy,easyui,web">
   <meta name="description" content="easyui help you build your web page easily!">
   <title>Form - jQuery EasyUI Demo</title>
   <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/default/easyui.css">
   <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css">
   <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
   <script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
</head>
<body>
   <form id="myForm">
      <select
         id="patient_id"
         name="patient_id"
         class="easyui-combobox"                                 
         data-options="
            url:'test.php',
            valueField:'id',
            textField:'name',
            mode:'remote',
            disabled:true,
            hasDownArrow:false,
                onBeforeLoad:function(param){param.q = $(this).combobox('getValue')}"
         style="
            width:200px;"
         />                 
   </form>
   <script>
      $(function(){
         $('#myForm').form({
            onLoadSuccess:function(){
               $('#patient_id').combobox('reload');
            }
         }).form('load',{
            patient_id: 6
         });
      });
   </script>
</body>
</html>