Beginners Learn EASYUI+JS----COMBOBOX Cascade

Recently in doing a Easyui ComboBox level linkage effect, the relevant content is as follows:

Easyui just contact, JS learned before, but in how to use this aspect of oneself is a novice, but now still in continuous learning, practice, this is the hard truth, directly on the code:

HTML code for the foreground:

<span> Academy: </span><input id= "College" class= "Easyui-combobox"   name= "Dropdownlist_course" style= " width:180px; " />                                   @* Course drop-down box *@    <span style= "margin-left:5px;" > Course: </span><input id= "Course" class= "Easyui-combobox"  name= "Dropdownlist_course" style= "width: 180px; " data-options= "Valuefield: ' CourseID ', TextField: ' Coursename '"/> @*    exam dropdown box *@    <span style= "Margin-left : 5px; " > Exam Name: </span><input id= "Examname" class= "Easyui-combobox"  name= "Dropdownlist_examname" style= " width:180px; "data-options=" Valuefield: ' Examid ', TextField: ' Examname ' "/> @* session dropdown    Box *@    <span style=" margin-left:5px; " > Examination: </span><input id= "Classroom" class= "Easyui-combobox" name= "  dropdownlist_examroom" style= " width:180px; "data-options=" Valuefield: ' Virtualexamroomid ', TextField: ' Classroomid ' "/>

Here is the JS code:

$ (function () {//drop-down cascade//college var college = $ (' #College '). ComboBox ({valuefield: ' Organizationpid ',        TextField: ' OrganizationName ', method: ' Get ', url: '/examinee/queryallcollege ', Onloadsuccess:onloadsuccess,//Check all College Onselect:function (REC) {//According to the Academy for all courses $.get (' /examinee/querycouserinfobyorganizationid ', {"Organizationpid": Rec.                Organizationpid}, function (data) {Course.combobox ("clear"). ComboBox (' LoadData ', data);                Examname.combobox ("clear");            Classname.combobox ("clear");        }, ' json ');    }    });    Course var Encollege = $ (' #College '). ComboBox (' GetText ');        var course = $ (' #Course '). ComboBox ({valuefield: ' CourseID ', TextField: ' Coursename ', method: ' Get ', Onloadsuccess:onloadsuccess, Onselect:function (REC) {//Check the exam name according to the course ID $.get ('/examine E/queryexambycourseid ', { ' CourseID ': rec. CourseID, ' OrganizationName ': Encollege}, function (data) {Examname.combobox ("clear"). ComboBox (' LoadData ')                , data);            Classname.combobox ("clear");        }, ' json ');    }    }); Test name var examname = $ (' #ExamName '). ComboBox ({valuefield: ' Examid ', TextField: ' Examname ', metho D: ' Get ', onloadsuccess:onloadsuccess, Onselect:function (REC) {//Query the exam room information $.get ('/examinee/que Ryclassroomidbyexamid ', {' Examid ': rec.            Examid}, function (data) {Classname.combobox ("clear"). ComboBox (' LoadData ', data);        });    }    }); Examination room var classname = $ (' #ClassName '). ComboBox ({valuefield: ' Virtualexamroomid ', TextField: ' Classroomid ')    , onloadsuccess:onloadsuccess});        Initialize selects the first function onloadsuccess () {var target = $ (this);        var data = Target.combobox ("GetData");        var options = Target.combobox ("Options"); if (datA && data.length > 0) {var fs = data[0];        Target.combobox ("SetValue", Fs[options.valuefield]); }    }});

Good memory is better than bad writing, these are valuable experiences.

Beginners Learn EASYUI+JS----COMBOBOX Cascade