Grid Demo-Popup dialog box to add grid data

• Create dialog box

1 <%--New Pop-up dialog box--%>2 <DivID= "Dlg"class= "Easyui-dialog"style= "width:400px;height:280px;padding:10px 20px"3 closed= "true"Buttons= "#dlg-buttons">4     <Divclass= "Ftitle">User Information</Div>5     <formID= "FM"Method= "POST">6         <Divclass= "Fitem">7             <label>First Name:</label>8             <inputname= "FirstName"class= "Easyui-validatebox"Required= "true">9         </Div>Ten         <Divclass= "Fitem"> One             <label>Last Name:</label> A             <inputname= "LastName"class= "Easyui-validatebox"Required= "true"> -         </Div> -         <Divclass= "Fitem"> the             <label>Phone:</label> -             <inputname= "Phone"> -         </Div> -         <Divclass= "Fitem"> +             <label>Email:</label> -             <inputname= "Email"class= "Easyui-validatebox"Validtype= "Email"> +         </Div> A     </form> at </Div> - <DivID= "Dlg-buttons"> -     <ahref="#"class= "Easyui-linkbutton"Iconcls= "Icon-ok"onclick= "Saveuser ()">Save</a> -     <ahref="#"class= "Easyui-linkbutton"Iconcls= "Icon-cancel" - onclick= "javascript:$ (' #dlg '). Dialog (' Close ')">Cancel</a> - </Div>

• New dialog box pops up when clicking New on the Grid object

1 toolbar: [2             {3Iconcls: ' Icon-add ',4Handlerfunction () {5$ (' #dlg '). Dialog (' Open '). dialog (' Settitle ', ' New User ');6$ (' #fm '). Form (' Clear ');7                 }8 9}, ‘-‘, {TenIconcls: ' Icon-edit ', OneHandlerfunction () { AAlert ("Modify"); -                 } -}, ‘-‘, { theIconcls: ' Icon-remove ', -Handlerfunction () { -Alert ("Remove"); -                 } +             } -],

• Implementing the Save Method

        functionSaveuser () {$ (' #fm '). Form (' Submit ', {URL:"<%=homepage%>/test/testcontroller.ajax?datagrid=1", OnSubmit:function(){                    return$( This). Form (' Validate '); }, Success:function(Result) {varresult = eval (' (' +result+ ') '); if(result.errormsg) {$.messager.show ({title:' Error ', MSG:RESULT.ERRORMSG}); } Else {                        $(' #dlg '). Dialog (' Close ');//Close the dialog$ (' #dg '). DataGrid (' reload ');//Reload the user data                    }                }            }); }

Grid Demo-Popup dialog box to add grid data