Home > Back-end >  Easyui child pages, and submit the form after closing, refreshes the parent page
Easyui child pages, and submit the form after closing, refreshes the parent page

Time:09-22

EasyUI three nested page, the index page layout is the layout, accordion accordion component on the left, the middle is tabs TAB, click on the button in the accordion, added a tabs show list page, showing the datagrid data table, the list page has a add button, when I click the add button to create a new tabs, to display the add page, add the page is written in a form form dialog, now I want to achieve, click the confirm button dialog, closing the current TAB page (add), and refresh the datagrid (list page), how to implement the
ask ace to give advice or comments

the index page code
 & lt; head> 
& lt; The script type="text/javascript" & gt;
$(function () {
$(" # linkbutton a "). Click (function () {
//get the component attributes or the content of
Var title=$(this). The text ();
Var src=https://bbs.csdn.net/topics/$(this). Attr (" title ");
If ($(" # "tt) tabs (" exists", the title)) {
$(" # "tt). Tabs (" select", the title);
} else {
$(' # 'tt). Tabs (' add', {
Title: the title,
Content: '& lt; The iframe frameborder=0 style=width: 100%; Height: SRC='https://bbs.csdn.net/topics/+ SRC + 100% & gt; & lt;/iframe> '
Closable: true
});
}
});
/* * linkbutton button/
$(' # linkbutton a '). Linkbutton ({
Toggle: true,
Group: "g2",
Plain: true
});
});
& lt;/script>
& lt;/head>

& lt; body>
& lt; Div id="cc" fit=true
Style="width: 100%; Height: 100%;">
& lt; Div region="north" title="easyui - layout" split="false"
Style="height: 100 px;"> & lt;/div>
& lt; Div region="west" iconCls="icon - the" ok "to" split="true" title="menu"
Style="width: 200 px;">
& lt; Div id="aa" fit=true>
& lt; Div title="user management" id="linkbutton & gt;"
& nbsp; & lt; A title="${CXT} user/list" & gt; User list & lt;/a> & lt; Br/& gt;
& lt;/div>
& lt;/div>
& lt;/div>
& lt; Div region="center" title="main screen" style="padding: 0 px;">
& lt; Div id="tt" fit=true>
& lt; Div id="myid" title="home page" style="padding: 20 px;"> & lt;/div>
& lt;/div>
& lt;/div>
& lt;/div>
& lt;/body>


list page code
 & lt; body> 
& lt; ! - the datagrid - & gt;
& lt; The table id="dg" & gt; & lt;/table>
& lt; ! - the toolbar - & gt;
& lt; Div id="toolbar" & gt;
& lt; AddBtn a id="" title=" ${CXT} user/add "data - the options=" iconCls: 'icon - add "& gt; Add & lt;/a>
& lt; A id="editBen" href="javascript: void (0)" data - the options="iconCls: 'icon - edit" & gt; Modify & lt;/a>
& lt; A id="deleteBtn" href="javascript: void (0)" data - the options="iconCls: 'icon - remove" & gt; Delete & lt;/a>
& lt;/div>
& lt; ! - Windows - & gt;
& lt; Div id="mywin" data - the options="title: 'add', width: 300, hieght: 400, closed: true" & gt;

& lt;/div>
& lt; The script type="text/javascript" & gt;
$(function () {
$(" # dg "). The datagrid ({
//idField: "id",
Title: "data table",
Url: '${CXT} user/main',
Fit: true,
LoadMsg: "data load... "
Rownumbers: true,
Pagination: true,
The columns: [[
{field: "id", the title: 'the primary key id, width: 100, the checkbox: true},
{field: 'name', the title: 'name', width: 100},
{field: 'password', the title: "password", width: 100},
{field: 'idCard, title:' id number, width: 100},
{field: 'phone', the title: 'cell phone number, width: 100},
{field: 'address, title:' address, width: 100},

]],
The toolbar: "# toolbar"
});

//opened a window click on add
$(" # addBtn "). Click (function () {
Var jq=parent. JQuery;
Var title=$(this). The text ();
Var src=https://bbs.csdn.net/topics/$(this). Attr (" title ");

If (jq (" easyui - tabs "). The tabs (' exists, the title)) {
Jq (" easyui - tabs "). The tabs (' select 'title);
} else {
Var content='& lt; The iframe scrolling="auto" frameborder="0" SRC="https://bbs.csdn.net/topics/+ SRC + 'style=" width: 100%; Height: 100%;"> & lt;/iframe> ';
Jq (" easyui - tabs "). The tabs (' add ', {
Title: the title,
Content: the content,
Closable: true
});
}
});
});

//child page calls refresh the datagrid
The function reloadDatagrid () {
$(" # dg "). The datagrid (' reload ');
}
});
& lt;/body>



The add page code

 & lt; head> 
& lt; The script type="text/javascript" & gt;
$(function () {
//dialog
$(' # dialog. The dialog ({
Title: 'add',
Closable: false,
Fit: true,
Buttons: [{
Text: 'sure,
IconCls: 'icon - ok,

Handler: function () {
The debugger.
$(" # myform "). The form (" submit ", {
Url: '${CXT} user/saveperson',
OnSubmit: function () {
Return the $(" # myform "). The form (" validate ");
},
Success: the function (data) {
Data=https://bbs.csdn.net/topics/eval (" (" + data + ") ");
If (data. Success) {
//1. Empty form
$(" # myform "). The form (" the clear ");
//2. Close the window
Var jq=parent. JQuery;
Jq (" easyui - tabs "). The tabs (' close 'and' add ');
//3. Refresh the datagrid
Window. The parent. ReloadDatagrid ();
$. Messenger. Show ({
Title: "prompt",
MSG: "save success
"});
} else {
nullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnull
  • Related