fork download
  1. <%@ Page Title="" Language="C#" MasterPageFile="~/admin.master" AutoEventWireup="true" CodeFile="manageusers.aspx.cs" Inherits="manageusers" %>
  2.  
  3. <asp:Content ID="Content1" ContentPlaceHolderID="cntAdmin" Runat="Server">
  4. <link href="js/jquery-ui-1.9.2.custom.css" rel="stylesheet" type="text/css" />
  5. <link href="css/customcss/manageusers.css" rel="stylesheet" />
  6. <link href="js/ui.jqgrid.css" rel="stylesheet" type="text/css" />
  7.  
  8.  
  9. <script src="ViewModel/UserViewModel.js" type="text/javascript"></script>
  10. <script src="Scripts/jquery-2.0.3.min.js"></script>
  11. <script src="Scripts/knockout-3.0.0.js"></script>
  12. <script src="Scripts/knockout.validation.js" type="text/javascript"></script>
  13. <script src="js/jquery.jqGrid.js" type="text/javascript"></script>
  14. <script src="js/grid.locale-en.js" type="text/javascript"></script>
  15.  
  16. <link rel="stylesheet" href="https://c...content-available-to-author-only...y.com/ui/1.12.1/themes/base/jquery-ui.css">
  17.  
  18. <script src="https://c...content-available-to-author-only...y.com/ui/1.12.1/jquery-ui.min.js"></script>
  19.  
  20.  
  21. <script language="javascript" type="text/javascript">
  22. $(document).ready(
  23.  
  24. function() {
  25.  
  26. BindGrid();
  27.  
  28. });
  29. </script>
  30. <form runat="server" id="formID" method="post">
  31. <asp:HiddenField ID="hdnRoles" runat="server" />
  32.  
  33. <div class="right_col manage-users-right-col" role="main">
  34. <div class="tab-content">
  35. <div role="tabpanel" class="tab-pane active" id="createuser">
  36. <div class="col-md-6 col-sm-6 col-xs-12 fst-col">
  37.  
  38. <div class="x_panel edit_manage_user fst-panel">
  39. <div class="title_left create_user_title">
  40. <h3>Create User</h3>
  41. </div>
  42. <div class="x_content">
  43. <div class="user-create-frm-div">
  44. <form id="demo-form2" data-parsley-validate class="form-horizontal form-label-left manageuser_leftform">
  45.  
  46. <div class="form-group">
  47. <label class="control-label col-md-3 col-sm-3 col-xs-6 headings" for="first-name">Location <span class="required">*</span>
  48. </label>
  49.  
  50. <div class="col-md-9 col-sm-9 col-xs-6">
  51.  
  52. <select data-bind="options: $root.Locations, optionsText: 'Location_Name',optionsValue:'Location_ID',value: LocId"></select>
  53.  
  54. </div>
  55. </div>
  56. <div class="form-group">
  57. <label class="control-label col-md-3 col-sm-3 col-xs-6 headings" for="first-name">Designation <span class="required">*</span>
  58. </label>
  59.  
  60. <div class="col-md-9 col-sm-9 col-xs-6">
  61.  
  62. <select data-bind="options: $root.Designations, optionsText: 'DesgName',optionsValue:'DesgID',value: Counter_NO"></select>
  63.  
  64. </div>
  65. </div>
  66.  
  67. <div class="form-group">
  68.  
  69.  
  70.  
  71. </div>
  72.  
  73. <div class="form-group">
  74. <label class="control-label col-md-3 col-sm-3 col-xs-6 headings" for="last-name">User ID <span class="required">*</span>
  75. </label>
  76. <div class="col-md-9 col-sm-9 col-xs-6">
  77. <input type="text" data-bind="value:User_ID" />
  78. </div>
  79. </div>
  80.  
  81. <div class="form-group">
  82. <label class="control-label col-md-3 col-sm-3 col-xs-6 headings" for="last-name">Password <span class="required">*</span>
  83. </label>
  84. <div class="col-md-9 col-sm-9 col-xs-6">
  85. <input type="password" data-bind="value:UserPWD" />
  86. </div>
  87. </div>
  88.  
  89. <div class="form-group">
  90. <label class="control-label col-md-3 col-sm-3 col-xs-6 headings" for="last-name">Discontinued <span class="required">*</span>
  91. </label>
  92. <div class="col-md-9 col-sm-9 col-xs-6">
  93. <label class="check-cnt"> <input type="checkbox" data-bind="checked:Discontinued" /> <span class="checkmark"></span>
  94. </label>
  95. </div>
  96. </div>
  97.  
  98.  
  99.  
  100. <div class="form-group">
  101. <div class="col-md-12 col-sm-12 col-xs-12">
  102.  
  103. <button type="button" data-bind="click:$root.InsertUpdate,text:ButtonText" class="btn btn-add"></button>
  104. <button type="button" data-bind="click:$root.Cancel,visible:IsVisible" class="btn btn-del">Cancel</button>
  105.  
  106. </div>
  107. </div>
  108.  
  109. </form>
  110. </div>
  111. </div>
  112. </div>
  113.  
  114. </div>
  115. <div class="col-md-6 col-sm-6 col-xs-12 scn-col">
  116. <div class="">
  117. <div class="x_panel edit_manage_user scn-panel">
  118. <!-- <div class="x_title">
  119. <h2>Manage Users </h2>
  120. <ul class="nav navbar-right panel_toolbox">
  121. <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
  122. </li>
  123. <li class="dropdown">
  124. <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
  125. <ul class="dropdown-menu" role="menu">
  126. <li><a href="#">Settings 1</a>
  127. </li>
  128. <li><a href="#">Settings 2</a>
  129. </li>
  130. </ul>
  131. </li>
  132. <li><a class="close-link"><i class="fa fa-close"></i></a>
  133. </li>
  134. </ul>
  135. <div class="clearfix"></div>
  136. </div>-->
  137. <div class="x_content">
  138.  
  139. <div>
  140. <table id="jQGridDemo">
  141. </table>
  142. <div id="jQGridDemoPager">
  143. </div>
  144.  
  145. </div>
  146.  
  147. </div>
  148. </div>
  149. </div>
  150. </div>
  151.  
  152.  
  153.  
  154.  
  155. </div>
  156. <div role="tabpanel" class="tab-pane" id="changepass">
  157.  
  158.  
  159.  
  160.  
  161. <div class="">
  162.  
  163.  
  164. <div class="x_panel edit_manage_user fst-panel">
  165. <div class="title_left">
  166. <h3>Change Password</h3>
  167. </div>
  168. <div class="x_content">
  169.  
  170. <table cellpadding="0" cellspacing="0" border="0" id="frmCityCpas" class="table-condensed manageuser_leftform">
  171.  
  172. <tr>
  173. <td class="headings">Old Password:</td>
  174. <td>
  175. <input type="Password" name="txtOldPassword" class="form-control validate required alphanumeric" data-index="1" id="txtOldPassword" runat="server" />
  176. </td>
  177. </tr>
  178.  
  179. <tr>
  180. <td class="headings">New Password:</td>
  181. <td>
  182. <input type="Password" name="txtNewPassword" class="form-control validate required alphanumeric" data-index="1" id="txtNewPassword" runat="server" />
  183. </td>
  184. </tr>
  185.  
  186. <tr>
  187. <td class="headings">Confirm Password:</td>
  188. <td>
  189. <input type="Password" name="txtCnfrmPassword" class="form-control validate required alphanumeric" data-index="1" id="txtConfirmPassword" runat="server" />
  190. </td>
  191. </tr>
  192. <tr>
  193. <td colspan="100%">
  194. <table cellspacing="0" cellpadding="0">
  195. <tr>
  196. <td></td>
  197. <td>
  198.  
  199. <asp:Button ID="btnAddCpas" Text="Change Password" class="btn btn-add btn-small change-pass-btn" runat="server" onclick="btnAdd_Click" />
  200.  
  201. </td>
  202.  
  203. </tr>
  204. </table>
  205. </td>
  206.  
  207. </tr>
  208.  
  209. </table>
  210.  
  211. </div>
  212. </div>
  213.  
  214. </div>
  215.  
  216.  
  217.  
  218.  
  219.  
  220. </div>
  221. <div role="tabpanel" class="tab-pane" id="roles">
  222.  
  223.  
  224. <div class="">
  225. <div class="col-md-6 col-sm-6 col-xs-12 fst-col">
  226.  
  227. <div class="x_panel edit_manage_user fst-panel">
  228. <div class="title_left">
  229. <h3>Roles</h3>
  230. </div>
  231. <div class="x_content">
  232.  
  233. <table cellpadding="0" cellspacing="0" border="0" id="frmCityRole" class="table-condensed manageuser_leftform" >
  234.  
  235.  
  236. <tr><td class="headings">Title:</td><td> <input type="text" name="txtTitleRole" maxlength="50" class="form-control validate required alphanumeric" data-index="1" id="txtTitleRole" /></td></tr>
  237.  
  238. <tr><td class="headings">IsActive:</td><td align="left" style="text-align:left"><label class="check-cnt"> <input type="checkbox" id="chkIsActiveRole" checked="checked" data-index="2" name="chkIsActiveRole" /><span class="checkmark"></span>
  239. </label></td></tr>
  240.  
  241.  
  242. <tr>
  243.  
  244. <td colspan="100%;" >
  245. <table cellspacing="0" cellpadding="0" class="btn-tbl-roles">
  246. <tr>
  247. <td> <div id="btnAddRole" class="btn btn-add btn-small" >Add Role</div>
  248. <div id="btnUpdateRole" class="btn btn-add btn-small" style="display:none;" >Update Role</div>
  249. <div id="btnResetRole" class="btn btn-del btn-small" style="display:none;" >Cancel</div></td>
  250.  
  251.  
  252. </tr>
  253. </table>
  254. </td>
  255.  
  256. </tr>
  257.  
  258. </table>
  259.  
  260. </div>
  261. </div>
  262. </div>
  263.  
  264. <div class="col-md-6 col-sm-6 col-xs-12 scn-col">
  265. <div class="x_panel edit_manage_user scn-panel">
  266.  
  267. <div class="x_content manage-roles-second-section">
  268.  
  269. <div class="youhave">
  270.  
  271. <table id="jQGridDemoRole">
  272. </table>
  273.  
  274.  
  275. <div id="jQGridDemoPagerRole">
  276. </div>
  277.  
  278. </div>
  279.  
  280. </div>
  281. </div>
  282. </div>
  283.  
  284.  
  285.  
  286.  
  287. </div>
  288. <!-- /page content -->
  289. <script language="javascript" type="text/javascript">
  290. var m_RoleId = 0;
  291.  
  292. function ResetControlsRole() {
  293. m_RoleId = 0;
  294. var txtTitle = $("#txtTitleRole");
  295. var btnAdd = $("#btnAddRole");
  296. var btnUpdate = $("#btnUpdateRole");
  297. txtTitle.focus();
  298. $("#chkIsActiveRole").prop("checked", "checked");
  299. txtTitle.val("");
  300. txtTitle.focus();
  301.  
  302. btnAdd.css({ "display": "inline-block" });
  303. btnAdd.html("Add Role");
  304.  
  305. btnUpdate.css({ "display": "none" });
  306. btnUpdate.html("Update Role");
  307.  
  308. $("#btnResetRole").css({ "display": "none" });
  309. $("#hdnId").val("0");
  310.  
  311. }
  312.  
  313.  
  314.  
  315. function TakeMeTop() {
  316. $("html, body").animate({ scrollTop: 0 }, 500);
  317. }
  318.  
  319. function RefreshGrid() {
  320. $('#jQGridDemo').trigger('reloadGrid');
  321.  
  322. }
  323.  
  324. function InsertUpdateRole() {
  325.  
  326.  
  327. var Id = m_RoleId;
  328. var Title = $("#txtTitleRole").val();
  329. if ($.trim(Title) == "") {
  330. $("#txtTitleRole").focus();
  331.  
  332. return;
  333. }
  334.  
  335.  
  336. var IsActive = false;
  337.  
  338. if ($('#chkIsActiveRole').is(":checked")) {
  339. IsActive = true;
  340. }
  341.  
  342.  
  343. $.ajax({
  344. type: "POST",
  345. data: '{"RoleId":"' + Id + '", "Title": "' + Title + '","IsActive": "' + IsActive + '"}',
  346. url: "manageroles.aspx/Insert",
  347. contentType: "application/json",
  348. dataType: "json",
  349. success: function (msg) {
  350.  
  351. var obj = jQuery.parseJSON(msg.d);
  352.  
  353. if (obj.Status == -1) {
  354.  
  355. alert("Insertion Failed.Role with duplicate name already exists.");
  356. return;
  357. }
  358.  
  359. if (Id == "0") {
  360. ResetControlsRole();
  361.  
  362. jQuery("#jQGridDemoRole").jqGrid('addRowData', obj.Role.RoleId, obj.Role, "last");
  363.  
  364. alert("Role is added successfully.");
  365. }
  366. else {
  367. ResetControlsRole();
  368.  
  369. var myGrid = $("#jQGridDemoRole");
  370. var selRowId = myGrid.jqGrid('getGridParam', 'selrow');
  371.  
  372.  
  373. myGrid.jqGrid('setRowData', selRowId, obj.Role);
  374. alert("Role is Updated successfully.");
  375. }
  376.  
  377.  
  378. },
  379. error: function (xhr, ajaxOptions, thrownError) {
  380.  
  381. var obj = jQuery.parseJSON(xhr.responseText);
  382. alert(obj.Message);
  383. },
  384. complete: function () {
  385. $.uiUnlock();
  386. }
  387. });
  388.  
  389. }
  390.  
  391.  
  392. $(document).ready(
  393. function () {
  394.  
  395. BindGridRole();
  396. BindGridPage();
  397.  
  398.  
  399. ValidateRolesPage();
  400.  
  401. function ValidateRolesPage() {
  402.  
  403. var arrRole = [];
  404. arrRole = $("#<%=hdnRoles.ClientID%>").val().split(',');
  405.  
  406. for (var i = 0; i < arrRole.length; i++) {
  407. if (arrRole[i] == "1") {
  408.  
  409. $("#btnAddPage").show();
  410.  
  411.  
  412. $("#btnAddPage").click(
  413. function () {
  414.  
  415. InsertUpdatePage();
  416.  
  417.  
  418. }
  419. );
  420.  
  421. }
  422.  
  423. else if (arrRole[i] == "3") {
  424.  
  425. $("#btnUpdatePage").click(
  426. function () {
  427.  
  428. var SelectedRow = jQuery('#jQGridDemoPage').jqGrid('getGridParam', 'selrow');
  429. if ($.trim(SelectedRow) == "") {
  430. alert("No Page is selected to Edit");
  431. return;
  432. }
  433.  
  434. InsertUpdatePage();
  435. }
  436. );
  437.  
  438. }
  439.  
  440. }
  441.  
  442. }
  443.  
  444.  
  445. $("#btnAddRole").click(
  446. function () {
  447.  
  448.  
  449. m_RoleId = 0;
  450. InsertUpdateRole();
  451. }
  452. );
  453.  
  454.  
  455. $("#btnResetPage").click(
  456. function () {
  457.  
  458. ResetControlsPage();
  459.  
  460. }
  461. );
  462.  
  463. $("#btnUpdateRole").click(
  464. function () {
  465.  
  466. var SelectedRow = jQuery('#jQGridDemoRole').jqGrid('getGridParam', 'selrow');
  467. if ($.trim(SelectedRow) == "") {
  468. alert("No Role is selected to Edit");
  469. return;
  470. }
  471.  
  472. InsertUpdateRole();
  473. }
  474. );
  475.  
  476.  
  477.  
  478.  
  479.  
  480. $('#txtTitleRole').focus();
  481. $('#txtTitleRole').keypress(function (event) {
  482.  
  483.  
  484. var keycode = (event.keyCode ? event.keyCode : event.which);
  485.  
  486. if (keycode == '13') {
  487.  
  488. InsertUpdateRole();
  489. }
  490.  
  491.  
  492. });
  493.  
  494.  
  495. $("#btnResetRole").click(
  496. function () {
  497.  
  498. ResetControlsRole();
  499.  
  500. }
  501. );
  502.  
  503.  
  504. }
  505. );
  506.  
  507. </script>
  508.  
  509. <script type="text/javascript">
  510. function BindGridRole() {
  511.  
  512. jQuery("#jQGridDemoRole").GridUnload();
  513. jQuery("#jQGridDemoRole").jqGrid({
  514. url: 'handlers/ManageRoles.ashx',
  515. ajaxGridOptions: { contentType: "application/json" },
  516. datatype: "json",
  517.  
  518. colNames: ['Role Id', 'Role', 'IsActive','Action'],
  519. colModel: [
  520. { name: 'RoleId', key: true, index: 'RoleId', width: 100, stype: 'text', sorttype: 'int', hidden: true },
  521.  
  522. { name: 'Title', index: 'Title', width: 200, stype: 'text', sortable: true, editable: true, editrules: { required: true } },
  523.  
  524.  
  525. { name: 'IsActive', index: 'IsActive', width: 150, editable: true, edittype: "checkbox", editoptions: { value: "true:false" }, formatter: "checkbox", formatoptions: { disabled: true } },
  526.  
  527. { name: 'act', index: 'act', width: 75, sortable: false },
  528.  
  529. ],
  530. rowNum: 10,
  531.  
  532. mtype: 'GET',
  533. loadonce: true,
  534. rowList: [10, 20, 30],
  535. pager: '#jQGridDemoPagerRole',
  536. sortname: 'RoleId',
  537. viewrecords: true,
  538. height: "100%",
  539. width: "400px",
  540. sortorder: 'asc',
  541. caption: "",
  542.  
  543. editurl: 'handlers/ManageRoles.ashx',
  544.  
  545. gridComplete: function () {
  546. var ids = jQuery("#jQGridDemoRole").jqGrid('getDataIDs');
  547. for (var i = 0; i < ids.length; i++) {
  548. var cl = ids[i];
  549. // be = "<div id='btndelcr' class='btn btn-small' ><i class='fa fa-trash m-right-xs' onclick=\"deleteAHead('" + cl + "');\"></i> </div>";
  550. //be = "<input style='height:22px;width:20px;' type='button' value='Edit' onclick=\"jQuery('#rowed2').editRow('" + cl + "');\" />";
  551. se = "<div id='btneditcrRole' class='btn btn-small' ><i class='fa fa-pencil m-right-xs' onclick=\"jQuery('#jQGridDemoRole').onSelectRow('" + cl + "');\"></i> </div>";
  552.  
  553. //var ce = <div id='btnReprint' class='btn btn-small' ><i class='fa fa-edit m-right-xs'></i> Reprint</div>
  554. //se = "<input style='height:22px;width:20px;' type='button' value='Delete' onclick=\"jQuery('#rowed2').restoreRow('" + cl + "');\" />";
  555. jQuery("#jQGridDemoRole").jqGrid('setRowData', ids[i], { act: se });
  556. }
  557. },
  558.  
  559.  
  560. ignoreCase: true,
  561. toolbar: [true, "top"],
  562.  
  563.  
  564. });
  565.  
  566.  
  567. var $grid = $("#jQGridDemoRole");
  568. // fill top toolbar
  569. $('#t_' + $.jgrid.jqID($grid[0].id))
  570. .append($("<div><label for=\"globalSearchText\">Global search for:&nbsp;</label><input id=\"globalSearchTextRole\" type=\"text\"></input>&nbsp;<button id=\"globalSearchRole\" type=\"button\">Search</button></div>"));
  571. $("#globalSearchTextRole").keypress(function (e) {
  572. var key = e.charCode || e.keyCode || 0;
  573. if (key === $.ui.keyCode.ENTER) { // 13
  574. $("#globalSearchRole").click();
  575. }
  576. });
  577. $("#globalSearchRole").button({
  578. icons: { primary: "ui-icon-search" },
  579. text: false
  580. }).click(function () {
  581. var postData = $grid.jqGrid("getGridParam", "postData"),
  582. colModel = $grid.jqGrid("getGridParam", "colModel"),
  583. rules = [],
  584. searchText = $("#globalSearchTextRole").val(),
  585. l = colModel.length,
  586. i,
  587. cm;
  588. for (i = 0; i < l; i++) {
  589. cm = colModel[i];
  590. if (cm.search !== false && (cm.stype === undefined || cm.stype === "text")) {
  591. rules.push({
  592. field: cm.name,
  593. op: "cn",
  594. data: searchText
  595. });
  596. }
  597. }
  598. postData.filters = JSON.stringify({
  599. groupOp: "OR",
  600. rules: rules
  601. });
  602. $grid.jqGrid("setGridParam", { search: true });
  603. $grid.trigger("reloadGrid", [{ page: 1, current: true }]);
  604. return false;
  605. });
  606.  
  607. $("#globalSearchRole").button({
  608. icons: { primary: "ui-icon-search" }, // This applies the jQuery UI search icon
  609. text: false // This hides the text and only shows the icon
  610. });
  611.  
  612.  
  613.  
  614.  
  615.  
  616. $("#jQGridDemoRole").jqGrid('setGridParam',
  617. {
  618. onSelectRow: function (rowid, iRow, iCol, e) {
  619. m_RoleId = 0;
  620.  
  621. //validateForm("detach");
  622.  
  623. var txtTitle = $("#txtTitleRole");
  624. m_RoleId = $('#jQGridDemoRole').jqGrid('getCell', rowid, 'RoleId');
  625.  
  626.  
  627.  
  628.  
  629. if ($('#jQGridDemoRole').jqGrid('getCell', rowid, 'IsActive') == "true") {
  630. $('#chkIsActiveRole').prop('checked', true);
  631. }
  632. else {
  633. $('#chkIsActiveRole').prop('checked', false);
  634.  
  635. }
  636.  
  637. txtTitle.val($('#jQGridDemoRole').jqGrid('getCell', rowid, 'Title'));
  638. txtTitle.focus();
  639. $("#btnAddRole").css({ "display": "none" });
  640. $("#btnUpdateRole").css({ "display": "inline-block" });
  641. $("#btnResetRole").css({ "display": "inline-block" });
  642. TakeMeTop();
  643. }
  644. });
  645.  
  646.  
  647.  
  648. var DataGrid = jQuery('#jQGridDemoRole');
  649. DataGrid.jqGrid('setGridWidth', '500');
  650.  
  651. $('#jQGridDemoRole').jqGrid('navGrid', '#jQGridDemoPagerRole',
  652. {
  653. refresh: false,
  654. edit: false,
  655. add: false,
  656. del: false,
  657. search: false,
  658. searchtext: "Search",
  659. addtext: "Add",
  660. },
  661.  
  662. {//SEARCH
  663. closeOnEscape: true
  664.  
  665. }
  666.  
  667. );
  668.  
  669.  
  670.  
  671. }
  672.  
  673.  
  674.  
  675.  
  676.  
  677. </script>
  678.  
  679.  
  680.  
  681.  
  682.  
  683.  
  684.  
  685.  
  686. </div>
  687. <div role="tabpanel" class="tab-pane" id="pages">
  688.  
  689. <input type="hidden" id="hdnId" value="0"/>
  690.  
  691.  
  692. <div class="">
  693. <div class="col-md-6 col-sm-6 col-xs-12 fst-col">
  694. <div class="x_panel edit_manage_user fst-panel">
  695. <div class="title_left">
  696. <h3>Membership Pages</h3>
  697. </div>
  698. <div class="x_content">
  699.  
  700. <div class="manageuser_leftform page-form">
  701. <div class="form-group">
  702. <label class="headings col-md-3 col-sm-3 col-xs-3" for="first-name">Title <span class="required">*</span>
  703. </label>
  704. <div class="col-md-9 col-sm-9 col-xs-9">
  705. <input type="text" name="txtTitlePage" maxlength="50" class="form-control validate required alphanumeric" data-index="1" id="txtTitlePage" />
  706. </div>
  707. </div>
  708. <div class="form-group">
  709. <label class="headings col-md-3 col-sm-3 col-xs-3" for="last-name">Roles <span class="required">*</span>
  710. </label>
  711. <div class="col-md-9 col-sm-9 col-xs-9">
  712. <asp:DropDownList ID="ddlRolesPage" runat="server" data-placeholder="" multiple class="chosen-select page-select">
  713.  
  714. </asp:DropDownList>
  715.  
  716. </div>
  717. </div>
  718.  
  719.  
  720.  
  721. <div class="form-group">
  722. <label class="headings col-md-3 col-sm-3 col-xs-3" for="last-name">Is Active </label>
  723.  
  724. <div class="col-md-9 col-sm-9 col-xs-9">
  725. <label class="check-cnt"><input type="checkbox" data-index="2" id="chkIsActivePage" checked=checked name="chkIsActivePage" /> <span class="checkmark"></span>
  726. </label>
  727. </div>
  728. </div>
  729.  
  730. <%-- <div class="ln_solid"></div>--%>
  731. <div class="form-group">
  732. <table >
  733. <tr>
  734. <td> <div id="btnAddPage" class="btn btn-add btn-small" style="display:none;" ><i class="fa fa-external-link"></i> Add</div></td>
  735. <td><div id="btnUpdatePage" class="btn btn-add btn-small" style="display:none;" ><i class="fa fa-edit m-right-xs"></i> Update Page</div></td>
  736. <td><div id="btnResetPage" class="btn btn-del btn-small" style="display:none;" ><i class="fa fa-trash m-right-xs"></i> Cancel</div></td>
  737.  
  738.  
  739. </tr>
  740. </table>
  741. </div>
  742. </div>
  743.  
  744. </div>
  745. </div>
  746. </div>
  747. <div class="col-md-6 col-sm-6 col-xs-12 scn-col">
  748. <div class="x_panel edit_manage_user scn-panel">
  749. <!-- <div class="x_title">
  750. <h2>Manage Membership Pages</h2>
  751.  
  752. <div class="clearfix"></div>
  753. </div> -->
  754. <div class="x_content">
  755.  
  756. <div class="youhave">
  757.  
  758. <table id="jQGridDemoPage">
  759. </table>
  760.  
  761. <div id="jQGridDemoPagerPage">
  762. </div>
  763.  
  764. </div>
  765.  
  766. </div>
  767. </div>
  768. </div>
  769.  
  770.  
  771.  
  772.  
  773.  
  774. </div>
  775. <!-- /page content -->
  776. <script type="text/javascript">
  777.  
  778.  
  779.  
  780. function BindGridPage() {
  781.  
  782. jQuery("#jQGridDemoPage").GridUnload();
  783.  
  784. jQuery("#jQGridDemoPage").jqGrid({
  785.  
  786. url: 'handlers/ManageMembershipPages.ashx',
  787. ajaxGridOptions: { contentType: "application/json" },
  788. datatype: "json",
  789.  
  790. colNames: ['Id', 'Title', 'IsActive', 'Roles','Action'],
  791. colModel: [
  792. { name: 'MembershipPageId', key: true, index: 'MembershipPageId', width: 100, stype: 'text', sorttype: 'int', hidden: true },
  793.  
  794. { name: 'Title', index: 'Title', width: 200, stype: 'text', sortable: true, editable: true, editrules: { required: true } },
  795.  
  796. { name: 'IsActive', index: 'IsActive', width: 150, editable: true, edittype: "checkbox", editoptions: { value: "true:false" }, formatter: "checkbox", formatoptions: { disabled: true } },
  797. { name: 'Roles', index: 'Roles', width: 200, stype: 'text', sortable: true, editable: true, hidden: true, editrules: { required: true } },
  798. { name: 'act', index: 'act', width: 75, sortable: false },
  799.  
  800.  
  801. ],
  802. rowNum: 10,
  803.  
  804. mtype: 'GET',
  805. loadonce: true,
  806. rowList: [10, 20, 30],
  807. pager: '#jQGridDemoPagerPage',
  808. sortname: 'Bank_ID',
  809. viewrecords: true,
  810. height: "100%",
  811. width: "400px",
  812. sortorder: 'asc',
  813. caption: "",
  814.  
  815. editurl: 'handlers/ManageMembershipPages.ashx',
  816. gridComplete: function () {
  817. var ids = jQuery("#jQGridDemoPage").jqGrid('getDataIDs');
  818. for (var i = 0; i < ids.length; i++) {
  819. var cl = ids[i];
  820. // be = "<div id='btndelcr' class='btn btn-small' ><i class='fa fa-trash m-right-xs' onclick=\"deleteAHead('" + cl + "');\"></i> </div>";
  821. //be = "<input style='height:22px;width:20px;' type='button' value='Edit' onclick=\"jQuery('#rowed2').editRow('" + cl + "');\" />";
  822. se = "<div id='btneditcrPage' class='btn btn-small' ><i class='fa fa-pencil m-right-xs' onclick=\"jQuery('#jQGridDemoPage').onSelectRow('" + cl + "');\"></i> </div>";
  823.  
  824. //var ce = <div id='btnReprint' class='btn btn-small' ><i class='fa fa-edit m-right-xs'></i> Reprint</div>
  825. //se = "<input style='height:22px;width:20px;' type='button' value='Delete' onclick=\"jQuery('#rowed2').restoreRow('" + cl + "');\" />";
  826. jQuery("#jQGridDemoPage").jqGrid('setRowData', ids[i], { act: se });
  827. }
  828. },
  829. ignoreCase: true,
  830. toolbar: [true, "top"],
  831.  
  832.  
  833. });
  834.  
  835.  
  836. var $grid = $("#jQGridDemoPage");
  837. // fill top toolbar
  838. $('#t_' + $.jgrid.jqID($grid[0].id))
  839. .append($("<div><label for=\"globalSearchTextPage\">Global search for:&nbsp;</label><input id=\"globalSearchTextPage\" type=\"text\"></input>&nbsp;<button id=\"globalSearchPage\" type=\"button\">Search</button></div>"));
  840. $("#globalSearchTextPage").keypress(function (e) {
  841. var key = e.charCode || e.keyCode || 0;
  842. if (key === $.ui.keyCode.ENTER) { // 13
  843. $("#globalSearchPage").click();
  844. }
  845. });
  846. $("#globalSearchPage").button({
  847. icons: { primary: "ui-icon-search" },
  848. text: false
  849. }).click(function () {
  850. var postData = $grid.jqGrid("getGridParam", "postData"),
  851. colModel = $grid.jqGrid("getGridParam", "colModel"),
  852. rules = [],
  853. searchText = $("#globalSearchTextPage").val(),
  854. l = colModel.length,
  855. i,
  856. cm;
  857. for (i = 0; i < l; i++) {
  858. cm = colModel[i];
  859. if (cm.search !== false && (cm.stype === undefined || cm.stype === "text")) {
  860. rules.push({
  861. field: cm.name,
  862. op: "cn",
  863. data: searchText
  864. });
  865. }
  866. }
  867. postData.filters = JSON.stringify({
  868. groupOp: "OR",
  869. rules: rules
  870. });
  871. $grid.jqGrid("setGridParam", { search: true });
  872. $grid.trigger("reloadGrid", [{ page: 1, current: true }]);
  873. return false;
  874. });
  875.  
  876.  
  877. $("#jQGridDemoPage").jqGrid('setGridParam',
  878. {
  879. onSelectRow: function (rowid, iRow, iCol, e) {
  880.  
  881. // validateForm("detach");
  882. var txtTitle = $("#txtTitlePage");
  883.  
  884.  
  885. var arrRole = [];
  886. arrRole = $("#<%=hdnRoles.ClientID%>").val().split(',');
  887.  
  888.  
  889. $("#btnUpdatePage").css({ "display": "none" });
  890. $("#btnResetPage").css({ "display": "none" });
  891. $("#btnAddPage").css({ "display": "none" });
  892.  
  893.  
  894. for (var i = 0; i < arrRole.length; i++) {
  895.  
  896. if (arrRole[i] == 1) {
  897.  
  898. $("#btnAddPage").css({ "display": "block" });
  899. }
  900.  
  901. if (arrRole[i] == 3) {
  902.  
  903. $("#hdnId").val($('#jQGridDemoPage').jqGrid('getCell', rowid, 'MembershipPageId'));
  904.  
  905. var strRoles = $('#jQGridDemoPage').jqGrid('getCell', rowid, 'Roles');
  906. var parts = strRoles.split(',');
  907.  
  908. $("#<%=ddlRolesPage.ClientID %> > option").attr("selected", false);
  909.  
  910. for (var i = 0; i < parts.length; i++) {
  911.  
  912. $('#<%=ddlRolesPage.ClientID %> option[value=' + parts[i] + ']').prop('selected', 'selected');
  913. }
  914. $("#<%=ddlRolesPage.ClientID %>").trigger("chosen:updated");
  915.  
  916.  
  917.  
  918. if ($('#jQGridDemoPage').jqGrid('getCell', rowid, 'IsActive') == "true") {
  919. $('#chkIsActivePage').prop('checked', true);
  920. }
  921. else {
  922. $('#chkIsActivePage').prop('checked', false);
  923.  
  924. }
  925. txtTitle.val($('#jQGridDemoPage').jqGrid('getCell', rowid, 'Title'));
  926. txtTitle.focus();
  927. $("#btnAddPage").css({ "display": "none" });
  928. $("#btnUpdatePage").css({ "display": "block" });
  929. $("#btnResetPage").css({ "display": "block" });
  930. }
  931.  
  932. }
  933. TakeMeTop();
  934. }
  935. });
  936.  
  937. var DataGrid = jQuery('#jQGridDemoPage');
  938. DataGrid.jqGrid('setGridWidth', '500');
  939.  
  940. $('#jQGridDemoPage').jqGrid('navGrid', '#jQGridDemoPagerPage',
  941. {
  942. refresh: false,
  943. edit: false,
  944. add: false,
  945. del: false,
  946. search: false,
  947. searchtext: "Search",
  948. addtext: "Add",
  949. },
  950.  
  951. {//SEARCH
  952. closeOnEscape: true
  953.  
  954. }
  955.  
  956. );
  957.  
  958.  
  959.  
  960. }
  961.  
  962.  
  963.  
  964.  
  965.  
  966. </script>
  967.  
  968.  
  969.  
  970. <script language="javascript">
  971.  
  972. doChosen();
  973. function doChosen() {
  974.  
  975. var config = {
  976. '.chosen-select': {},
  977. '.chosen-select-deselect': { allow_single_deselect: true },
  978. '.chosen-select-no-single': { disable_search_threshold: 10 },
  979. '.chosen-select-no-results': { no_results_text: 'Oops, nothing found!' },
  980. '.chosen-select-width': { width: "95%" }
  981. }
  982. for (var selector in config) {
  983. $(selector).chosen(config[selector]);
  984. }
  985.  
  986. }
  987.  
  988.  
  989. function ApplyRoles(Roles) {
  990.  
  991. $("#<%=hdnRoles.ClientID%>").val(Roles);
  992. }
  993. function ResetControlsPage() {
  994. var txtTitle = $("#txtTitlePage");
  995. var btnAdd = $("#btnAddPage");
  996. var btnUpdate = $("#btnUpdatePage");
  997. $("#<%=ddlRolesPage.ClientID %> > option").attr("selected", false);
  998. $("#<%=ddlRolesPage.ClientID %>").trigger("chosen:updated");
  999. txtTitle.focus();
  1000. txtTitle.val("");
  1001. txtTitle.focus();
  1002. var arrRole = [];
  1003. arrRole = $("#<%=hdnRoles.ClientID%>").val().split(',');
  1004. btnAdd.css({ "display": "none" });
  1005. for (var i = 0; i < arrRole.length; i++) {
  1006. if (arrRole[i] == "1") {
  1007.  
  1008. $("#btnAddPage").css({ "display": "block" });
  1009.  
  1010. }
  1011.  
  1012. }
  1013.  
  1014.  
  1015. $("#btnUpdatePage").css({ "display": "none" });
  1016.  
  1017.  
  1018. $("#btnResetPage").css({ "display": "none" });
  1019. $("#chkIsActivePage").prop("checked", "checked");
  1020.  
  1021.  
  1022.  
  1023. $("#hdnId").val("0");
  1024.  
  1025. }
  1026.  
  1027.  
  1028.  
  1029. function TakeMeTop() {
  1030. $("html, body").animate({ scrollTop: 0 }, 500);
  1031. }
  1032.  
  1033. function RefreshGrid() {
  1034. $('#jQGridDemoPage').trigger('reloadGrid');
  1035.  
  1036. }
  1037.  
  1038. function InsertUpdatePage() {
  1039.  
  1040.  
  1041. var btnAdd = $("#btnAddPage");
  1042. var btnUpdate = $("#btnUpdatePage");
  1043.  
  1044. var Id = $("#hdnId").val();
  1045.  
  1046.  
  1047. var Title = $("#txtTitlePage").val();
  1048. if ($.trim(Title) == "") {
  1049. $("#txtTitlePage").focus();
  1050. //alert("Please enter Title");
  1051. return;
  1052. }
  1053.  
  1054. // $.uiLock('');
  1055. if (Id == "0") {
  1056. btnAdd.unbind('click');
  1057. }
  1058. else {
  1059. btnUpdate.unbind('click');
  1060. }
  1061.  
  1062.  
  1063.  
  1064. var IsActive = false;
  1065.  
  1066.  
  1067. if ($('#chkIsActivePage').is(":checked")) {
  1068. IsActive = true;
  1069. }
  1070. var arrRoles = $('#<%=ddlRolesPage.ClientID %>').val();
  1071.  
  1072.  
  1073.  
  1074. $.ajax({
  1075. type: "POST",
  1076. data: '{"id":"' + Id + '", "title": "' + Title + '","isActive": "' + IsActive + '","arrRoles":"' + arrRoles + '"}',
  1077. url: "managepages.aspx/Insert",
  1078. contentType: "application/json",
  1079. dataType: "json",
  1080. success: function (msg) {
  1081.  
  1082. var obj = jQuery.parseJSON(msg.d);
  1083.  
  1084. if (obj.Status == 0) {
  1085. ResetControlsPage();
  1086.  
  1087. if (Id == "0") {
  1088. btnAdd.bind('click', function () { InsertUpdatePage(); });
  1089. }
  1090. else {
  1091.  
  1092. btnUpdate.bind('click', function () { InsertUpdatePage(); });
  1093. }
  1094.  
  1095.  
  1096. alert("Insertion Failed.MembershipPage with duplicate name already exists.");
  1097. return;
  1098.  
  1099. }
  1100.  
  1101.  
  1102.  
  1103. if (obj.Status == -11) {
  1104. alert("You don't have permission to perform this action..Consult Admin Department.");
  1105. return;
  1106. }
  1107.  
  1108. if (Id == "0") {
  1109. btnAdd.bind('click', function () { InsertUpdatePage(); });
  1110.  
  1111. jQuery("#jQGridDemoPage").jqGrid('addRowData', obj.MembershipPage.MembershipPageId, obj.MembershipPage, "last");
  1112.  
  1113.  
  1114.  
  1115. ResetControlsPage();
  1116.  
  1117. alert("MembershipPage added successfully.");
  1118.  
  1119. }
  1120. else {
  1121.  
  1122. btnUpdate.bind('click', function () { InsertUpdatePage(); });
  1123.  
  1124. var myGrid = $("#jQGridDemoPage");
  1125. var selRowId = myGrid.jqGrid('getGridParam', 'selrow');
  1126.  
  1127.  
  1128. myGrid.jqGrid('setRowData', selRowId, obj.MembershipPage);
  1129.  
  1130. alert("MembershipPage Updated successfully.");
  1131. ResetControlsPage();
  1132.  
  1133. }
  1134.  
  1135. },
  1136. error: function (xhr, ajaxOptions, thrownError) {
  1137.  
  1138. var obj = jQuery.parseJSON(xhr.responseText);
  1139. alert(obj.Message);
  1140. },
  1141. complete: function () {
  1142. $.uiUnlock();
  1143.  
  1144. }
  1145.  
  1146.  
  1147.  
  1148. });
  1149.  
  1150. }
  1151.  
  1152.  
  1153.  
  1154.  
  1155. $(document).ready(
  1156. function () {
  1157.  
  1158.  
  1159. $('#txtTitlePage').focus();
  1160. $('#txtTitlePage').keypress(function (event) {
  1161.  
  1162.  
  1163. var keycode = (event.keyCode ? event.keyCode : event.which);
  1164.  
  1165. if (keycode == '13') {
  1166.  
  1167. InsertUpdatePage();
  1168. }
  1169.  
  1170.  
  1171. });
  1172.  
  1173.  
  1174.  
  1175.  
  1176.  
  1177. }
  1178. );
  1179.  
  1180.  
  1181.  
  1182.  
  1183.  
  1184. </script>
  1185.  
  1186.  
  1187.  
  1188.  
  1189. <script type="text/javascript">
  1190. var config = {
  1191. '.chosen-select': {},
  1192. '.chosen-select-deselect': { allow_single_deselect: true },
  1193. '.chosen-select-no-single': { disable_search_threshold: 10 },
  1194. '.chosen-select-no-results': { no_results_text: 'Oops, nothing found!' },
  1195. '.chosen-select-width': { width: "95%" }
  1196. }
  1197. for (var selector in config) {
  1198. $(selector).chosen(config[selector]);
  1199. }
  1200.  
  1201. </script>
  1202.  
  1203.  
  1204.  
  1205.  
  1206.  
  1207.  
  1208.  
  1209. </div>
  1210. <div role="tabpanel" class="tab-pane" id="applyroles">
  1211.  
  1212. <div class="">
  1213.  
  1214.  
  1215. <div class="row manage-apply-roles-row">
  1216. <div class="col-md-12 col-sm-12 col-xs-12">
  1217.  
  1218.  
  1219.  
  1220. <div class="x_panel edit_manage_user fst-panel">
  1221.  
  1222. <div class="title_left">
  1223. <h3>Apply Roles</h3>
  1224. </div>
  1225. <div class="x_content">
  1226.  
  1227. <div class="manageuser_leftform">
  1228.  
  1229.  
  1230. <div class="form-group">
  1231. <label class="headings col-md-3 col-sm-3 col-xs-4">Choose Designation</label>
  1232. <div class="col-md-9 col-sm-9 col-xs-8">
  1233.  
  1234. <select id="ddlDesignation" style="height:25px;width:200px"></select>
  1235. </div>
  1236. </div>
  1237.  
  1238.  
  1239. <div class="form-group">
  1240. <label class="headings">Roles:</label>
  1241. <div class="controls">
  1242.  
  1243. <div id="dvDesRoles" style="max-height:500px;overflow-y:scroll;width:300px">
  1244.  
  1245. </div>
  1246.  
  1247.  
  1248.  
  1249. </div>
  1250. </div>
  1251.  
  1252.  
  1253.  
  1254.  
  1255. <div class="form-group">
  1256.  
  1257.  
  1258. <table>
  1259. <tr>
  1260. <td><div id="btnAddApp" class="btn btn-add btn-small" style="height:30px" >Assign Roles</div>
  1261. </td>
  1262.  
  1263.  
  1264.  
  1265. </tr>
  1266. </table>
  1267.  
  1268. </div>
  1269.  
  1270.  
  1271.  
  1272. </div>
  1273. </div>
  1274. </div>
  1275.  
  1276. </div>
  1277. </div>
  1278.  
  1279.  
  1280. </div>
  1281. <!-- /page content -->
  1282.  
  1283. </div>
  1284.  
  1285. <script language="javascript">
  1286.  
  1287.  
  1288. function ShowHide(val) {
  1289. $("#tr" + val).slideToggle(50);
  1290. var img = $("#imgShowHide" + val);
  1291. var url = $(img).attr("src");
  1292. if (url == "images/icoplus.gif") {
  1293. $(img).attr("src", "images/icominus.gif");
  1294. }
  1295. else {
  1296. $(img).attr("src", "images/icoplus.gif");
  1297. }
  1298. }
  1299.  
  1300.  
  1301. function TakeMeTop() {
  1302. $("html, body").animate({ scrollTop: 0 }, 500);
  1303. }
  1304.  
  1305. function RefreshGrid() {
  1306. $('#jQGridDemo').trigger('reloadGrid');
  1307.  
  1308. }
  1309.  
  1310. $(document).ready(
  1311. function () {
  1312.  
  1313. $("#btnAddApp").click(
  1314. function () {
  1315. var btnAdd = $("#btnAddApp");
  1316.  
  1317.  
  1318. btnAdd.html("<img src='images/loader.gif' alt='loading...'/>")
  1319.  
  1320. var Pid = [];
  1321. var Rid = [];
  1322. var Did = $("#ddlDesignation").val();
  1323.  
  1324. $("input[name='Roles']:checked").each(
  1325. function (x) {
  1326.  
  1327. var pageId = $(this).attr("pid");
  1328. var roleId = $(this).val();
  1329.  
  1330. Pid[x] = pageId;
  1331. Rid[x] = roleId;
  1332.  
  1333. }
  1334.  
  1335. );
  1336.  
  1337.  
  1338.  
  1339. $.ajax({
  1340. type: "POST",
  1341. data: '{"Pid":"' + Pid + '", "Rid": "' + Rid + '","Did": "' + Did + '"}',
  1342. url: "manageapplyroles.aspx/Insert",
  1343. contentType: "application/json",
  1344. dataType: "json",
  1345. success: function (msg) {
  1346. btnAdd.html('Assign Roles');
  1347.  
  1348. var obj = jQuery.parseJSON(msg.d);
  1349.  
  1350. if (obj.Status == "1") {
  1351. alert("Roles Assigned Successfully");
  1352. }
  1353. else {
  1354. alert("Operation Failed");
  1355. }
  1356.  
  1357. },
  1358. error: function (xhr, ajaxOptions, thrownError) {
  1359. btnAdd.html('Assign Roles');
  1360.  
  1361. var obj = jQuery.parseJSON(xhr.responseText);
  1362. alert(obj.Message);
  1363. },
  1364. complete: function () {
  1365. $.uiUnlock();
  1366.  
  1367. }
  1368.  
  1369.  
  1370.  
  1371. });
  1372.  
  1373.  
  1374.  
  1375. }
  1376. );
  1377.  
  1378. $("#ddlDesignation").change(
  1379. function () {
  1380. $("#dvDesRoles").html("");
  1381. // $.uiLock('');
  1382. $.ajax({
  1383. type: "POST",
  1384. data: '{"designationId":"' + $(this).val() + '"}',
  1385. url: "manageapplyroles.aspx/GetRolesByDesignation",
  1386. contentType: "application/json",
  1387. dataType: "json",
  1388. success: function (msg) {
  1389.  
  1390. var obj = jQuery.parseJSON(msg.d);
  1391.  
  1392.  
  1393. $("#dvDesRoles").html(obj.Data);
  1394.  
  1395.  
  1396.  
  1397. },
  1398. error: function (xhr, ajaxOptions, thrownError) {
  1399.  
  1400. var obj = jQuery.parseJSON(xhr.responseText);
  1401. alert(obj.Message);
  1402. },
  1403. complete: function () {
  1404.  
  1405. $.uiUnlock();
  1406.  
  1407. }
  1408.  
  1409.  
  1410.  
  1411. });
  1412.  
  1413.  
  1414.  
  1415. }
  1416. );
  1417.  
  1418.  
  1419. $.ajax({
  1420. type: "POST",
  1421. data: '{}',
  1422. url: "manageapplyroles.aspx/GetDesignations",
  1423. contentType: "application/json",
  1424. dataType: "json",
  1425. success: function (msg) {
  1426.  
  1427. var obj = jQuery.parseJSON(msg.d);
  1428.  
  1429.  
  1430. $("#ddlDesignation").html(obj.DesignationOptions);
  1431.  
  1432.  
  1433.  
  1434. },
  1435. error: function (xhr, ajaxOptions, thrownError) {
  1436.  
  1437. var obj = jQuery.parseJSON(xhr.responseText);
  1438. alert(obj.Message);
  1439. },
  1440. complete: function () {
  1441.  
  1442. $.uiUnlock();
  1443. }
  1444.  
  1445.  
  1446.  
  1447. });
  1448.  
  1449. $.ajax({
  1450. type: "POST",
  1451. data: '{}',
  1452. url: "manageapplyroles.aspx/GetLocations",
  1453. contentType: "application/json",
  1454. dataType: "json",
  1455. success: function (msg) {
  1456.  
  1457. var obj = jQuery.parseJSON(msg.d);
  1458.  
  1459.  
  1460. $("#ddlDesignation").html(obj.DesignationOptions);
  1461.  
  1462.  
  1463.  
  1464. },
  1465. error: function (xhr, ajaxOptions, thrownError) {
  1466.  
  1467. var obj = jQuery.parseJSON(xhr.responseText);
  1468. alert(obj.Message);
  1469. },
  1470. complete: function () {
  1471.  
  1472. $.uiUnlock();
  1473. }
  1474.  
  1475.  
  1476.  
  1477. });
  1478.  
  1479.  
  1480. $("#btnAddApp").click(
  1481. function () {
  1482.  
  1483. InsertUpdate();
  1484.  
  1485.  
  1486. }
  1487. );
  1488.  
  1489.  
  1490. }
  1491. );
  1492.  
  1493. </script>
  1494.  
  1495.  
  1496. </div>
  1497.  
  1498.  
  1499.  
  1500. </div>
  1501.  
  1502.  
  1503.  
  1504.  
  1505.  
  1506. </form>
  1507. </asp:Content>
Success #stdin #stdout 0.02s 26060KB
stdin
Standard input is empty
stdout
<%@ Page Title="" Language="C#" MasterPageFile="~/admin.master" AutoEventWireup="true" CodeFile="manageusers.aspx.cs" Inherits="manageusers" %>

    <asp:Content ID="Content1" ContentPlaceHolderID="cntAdmin" Runat="Server">
		<link href="js/jquery-ui-1.9.2.custom.css" rel="stylesheet" type="text/css" />
        <link href="css/customcss/manageusers.css" rel="stylesheet" />
		<link href="js/ui.jqgrid.css" rel="stylesheet" type="text/css" />
		

        <script src="ViewModel/UserViewModel.js" type="text/javascript"></script>
        <script src="Scripts/jquery-2.0.3.min.js"></script>
        <script src="Scripts/knockout-3.0.0.js"></script>
        <script src="Scripts/knockout.validation.js" type="text/javascript"></script>
        <script src="js/jquery.jqGrid.js" type="text/javascript"></script>
        <script src="js/grid.locale-en.js" type="text/javascript"></script>

		<link rel="stylesheet" href="https://c...content-available-to-author-only...y.com/ui/1.12.1/themes/base/jquery-ui.css">

<script src="https://c...content-available-to-author-only...y.com/ui/1.12.1/jquery-ui.min.js"></script>


        <script language="javascript" type="text/javascript">
            $(document).ready(

                function() {

                    BindGrid();

                });
        </script>
          <form runat="server" id="formID" method="post">
            <asp:HiddenField ID="hdnRoles" runat="server" />

        <div class="right_col manage-users-right-col" role="main">
			<div class="tab-content">
				<div role="tabpanel" class="tab-pane active" id="createuser">
					<div class="col-md-6 col-sm-6 col-xs-12 fst-col">
					      
                    <div class="x_panel edit_manage_user fst-panel">
                        <div class="title_left create_user_title">
                            <h3>Create User</h3>
                        </div>
                        <div class="x_content">
                          <div class="user-create-frm-div">
                            <form id="demo-form2" data-parsley-validate class="form-horizontal form-label-left manageuser_leftform">

								<div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-6 headings" for="first-name">Location <span class="required">*</span>
                                    </label>

                                   <div class="col-md-9 col-sm-9 col-xs-6">

                                        <select data-bind="options: $root.Locations, optionsText: 'Location_Name',optionsValue:'Location_ID',value: LocId"></select>

                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-6 headings" for="first-name">Designation <span class="required">*</span>
                                    </label>

                                   <div class="col-md-9 col-sm-9 col-xs-6">

                                        <select data-bind="options: $root.Designations, optionsText: 'DesgName',optionsValue:'DesgID',value: Counter_NO"></select>

                                    </div>
                                </div>

                                <div class="form-group">
                                    

                                    
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-6  headings" for="last-name">User ID <span class="required">*</span>
                                    </label>
                                   <div class="col-md-9 col-sm-9 col-xs-6">
                                        <input type="text" data-bind="value:User_ID" />
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-6  headings" for="last-name">Password <span class="required">*</span>
                                    </label>
                                   <div class="col-md-9 col-sm-9 col-xs-6">
                                        <input type="password" data-bind="value:UserPWD" />
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-md-3 col-sm-3 col-xs-6  headings" for="last-name">Discontinued <span class="required">*</span>
                                    </label>
                                    <div class="col-md-9 col-sm-9 col-xs-6">
                                       <label class="check-cnt"> <input type="checkbox" data-bind="checked:Discontinued" /> <span class="checkmark"></span>
								</label>
                                    </div>
                                </div>
							
                                

                                <div class="form-group">
                                    <div class="col-md-12 col-sm-12 col-xs-12">

                                        <button type="button"  data-bind="click:$root.InsertUpdate,text:ButtonText" class="btn btn-add"></button>
                                        <button type="button" data-bind="click:$root.Cancel,visible:IsVisible" class="btn btn-del">Cancel</button>

                                    </div>
                                </div>

                            </form>
                        </div>
							</div>
                    </div>
             
					</div>
					<div class="col-md-6 col-sm-6 col-xs-12 scn-col">
						<div class="">
							  <div class="x_panel edit_manage_user scn-panel">
                         <!--   <div class="x_title">
                                <h2>Manage Users </h2>
                                <ul class="nav navbar-right panel_toolbox">
                                    <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                                    </li>
                                    <li class="dropdown">
                                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                                        <ul class="dropdown-menu" role="menu">
                                            <li><a href="#">Settings 1</a>
                                            </li>
                                            <li><a href="#">Settings 2</a>
                                            </li>
                                        </ul>
                                    </li>
                                    <li><a class="close-link"><i class="fa fa-close"></i></a>
                                    </li>
                                </ul>
                                <div class="clearfix"></div>
                            </div>-->
                            <div class="x_content">

                                <div>
                                    <table id="jQGridDemo">
                                    </table>
                                    <div id="jQGridDemoPager">
                                    </div>

                                </div>

                            </div>
                        </div>
                        </div>
					</div>
					

            

				</div>
				<div role="tabpanel" class="tab-pane" id="changepass">

 

        
                <div class="">


                    <div class="x_panel edit_manage_user fst-panel">
                         <div class="title_left">
                            <h3>Change Password</h3>
                        </div>
                        <div class="x_content">

                            <table cellpadding="0" cellspacing="0" border="0" id="frmCityCpas" class="table-condensed manageuser_leftform">

                                <tr>
                                    <td class="headings">Old Password:</td>
                                    <td>
                                        <input type="Password" name="txtOldPassword" class="form-control validate required alphanumeric" data-index="1" id="txtOldPassword" runat="server" />
                                    </td>
                                </tr>

                                <tr>
                                    <td class="headings">New Password:</td>
                                    <td>
                                        <input type="Password" name="txtNewPassword" class="form-control validate required alphanumeric" data-index="1" id="txtNewPassword" runat="server" />
                                    </td>
                                </tr>

                                <tr>
                                    <td class="headings">Confirm Password:</td>
                                    <td>
                                        <input type="Password" name="txtCnfrmPassword" class="form-control validate required alphanumeric" data-index="1" id="txtConfirmPassword" runat="server" />
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="100%">
                                        <table cellspacing="0" cellpadding="0">
                                            <tr>
                                                <td></td>
                                                <td>

                                                    <asp:Button ID="btnAddCpas" Text="Change Password" class="btn btn-add btn-small change-pass-btn" runat="server" onclick="btnAdd_Click" />

                                                </td>

                                            </tr>
                                        </table>
                                    </td>

                                </tr>

                            </table>

                        </div>
                    </div>

                </div>

        



				</div>
				<div role="tabpanel" class="tab-pane" id="roles">

                 
                <div class="">
					<div class="col-md-6 col-sm-6 col-xs-12 fst-col">
					
                    <div class="x_panel edit_manage_user fst-panel">
                        <div class="title_left">
                            <h3>Roles</h3>
                        </div>
                        <div class="x_content">

                             <table cellpadding="0" cellspacing="0" border="0" id="frmCityRole" class="table-condensed manageuser_leftform" >
                     
                   
                     <tr><td class="headings">Title:</td><td>  <input type="text"  name="txtTitleRole" maxlength="50" class="form-control validate required alphanumeric"   data-index="1" id="txtTitleRole" /></td></tr>
                      
                       <tr><td class="headings">IsActive:</td><td align="left" style="text-align:left"><label class="check-cnt"> <input type="checkbox" id="chkIsActiveRole" checked="checked" data-index="2"  name="chkIsActiveRole" /><span class="checkmark"></span>
								</label></td></tr> 
                      
               
                                            <tr>
                                         
                                            <td colspan="100%;"  >
                                            <table cellspacing="0" cellpadding="0" class="btn-tbl-roles">
                                            <tr>
                                            <td> <div id="btnAddRole"  class="btn btn-add btn-small" >Add Role</div>
                                            <div id="btnUpdateRole"  class="btn btn-add btn-small" style="display:none;" >Update Role</div>
                                            <div id="btnResetRole"  class="btn btn-del btn-small" style="display:none;" >Cancel</div></td>
                                            
                                           
                                            </tr>
                                            </table>
                                            </td>
                                            
                                            </tr>

                     </table>

                        </div>
                    </div>
					</div>
                    
<div class="col-md-6 col-sm-6 col-xs-12 scn-col">
	<div class="x_panel edit_manage_user scn-panel">
                       
                        <div class="x_content manage-roles-second-section">

                               <div class="youhave">
                    
      	          <table id="jQGridDemoRole">
    </table>

     
    <div id="jQGridDemoPagerRole">
    </div>
      
                    </div>

                        </div>
                    </div>
</div>

     

                     
                </div>
                <!-- /page content -->
<script language="javascript" type="text/javascript">
	var m_RoleId = 0;

	function ResetControlsRole() {
		m_RoleId = 0;
		var txtTitle = $("#txtTitleRole");
		var btnAdd = $("#btnAddRole");
		var btnUpdate = $("#btnUpdateRole");
		txtTitle.focus();
		$("#chkIsActiveRole").prop("checked", "checked");
		txtTitle.val("");
		txtTitle.focus();

		btnAdd.css({ "display": "inline-block" });
		btnAdd.html("Add Role");

		btnUpdate.css({ "display": "none" });
		btnUpdate.html("Update Role");

		$("#btnResetRole").css({ "display": "none" });
		$("#hdnId").val("0");
		
	}



	function TakeMeTop() {
		$("html, body").animate({ scrollTop: 0 }, 500);
	}

	function RefreshGrid() {
		$('#jQGridDemo').trigger('reloadGrid');

	}

	function InsertUpdateRole() {

		
		var Id = m_RoleId;
		var Title = $("#txtTitleRole").val();
		if ($.trim(Title) == "") {
			$("#txtTitleRole").focus();

			return;
		}


		var IsActive = false;

		if ($('#chkIsActiveRole').is(":checked")) {
			IsActive = true;
		}
	
		
		$.ajax({
			type: "POST",
			data: '{"RoleId":"' + Id + '", "Title": "' + Title + '","IsActive": "' + IsActive + '"}',
			url: "manageroles.aspx/Insert",
			contentType: "application/json",
			dataType: "json",
			success: function (msg) {

				var obj = jQuery.parseJSON(msg.d);

				if (obj.Status == -1) {

					alert("Insertion Failed.Role with duplicate name already exists.");
					return;
				}
				
				if (Id == "0") {
					ResetControlsRole();

					jQuery("#jQGridDemoRole").jqGrid('addRowData', obj.Role.RoleId, obj.Role, "last");

					alert("Role is added successfully.");
				}
				else {
					ResetControlsRole();

					var myGrid = $("#jQGridDemoRole");
					var selRowId = myGrid.jqGrid('getGridParam', 'selrow');


					myGrid.jqGrid('setRowData', selRowId, obj.Role);
					alert("Role is Updated successfully.");
				}


			},
			error: function (xhr, ajaxOptions, thrownError) {

				var obj = jQuery.parseJSON(xhr.responseText);
				alert(obj.Message);
			},
			complete: function () {
				$.uiUnlock();
			}
		});

	}

	
	$(document).ready(
        function () {
            
			BindGridRole();
			BindGridPage();


			ValidateRolesPage();

			function ValidateRolesPage() {

				var arrRole = [];
				arrRole = $("#<%=hdnRoles.ClientID%>").val().split(',');
				
				for (var i = 0; i < arrRole.length; i++) {
					if (arrRole[i] == "1") {

						$("#btnAddPage").show();


						$("#btnAddPage").click(
							function () {

								InsertUpdatePage();


							}
						);

					}

					else if (arrRole[i] == "3") {

						$("#btnUpdatePage").click(
							function () {

								var SelectedRow = jQuery('#jQGridDemoPage').jqGrid('getGridParam', 'selrow');
								if ($.trim(SelectedRow) == "") {
									alert("No Page is selected to Edit");
									return;
								}

								InsertUpdatePage();
							}
						);

					}

				}

			}


			$("#btnAddRole").click(
				function () {

					
					m_RoleId = 0;
					InsertUpdateRole();
				}
			);


			$("#btnResetPage").click(
				function () {
					
					ResetControlsPage();

				}
			);

			$("#btnUpdateRole").click(
				function () {

					var SelectedRow = jQuery('#jQGridDemoRole').jqGrid('getGridParam', 'selrow');
					if ($.trim(SelectedRow) == "") {
						alert("No Role is selected to Edit");
						return;
					}
					
					InsertUpdateRole();
				}
			);





			$('#txtTitleRole').focus();
			$('#txtTitleRole').keypress(function (event) {


				var keycode = (event.keyCode ? event.keyCode : event.which);

				if (keycode == '13') {

					InsertUpdateRole();
				}


			});


			$("#btnResetRole").click(
				function () {

					ResetControlsRole();

				}
			);


		}
	);

</script>

               <script type="text/javascript">
                   function BindGridRole() {
                      
					   jQuery("#jQGridDemoRole").GridUnload();
					   jQuery("#jQGridDemoRole").jqGrid({
						   url: 'handlers/ManageRoles.ashx',
						   ajaxGridOptions: { contentType: "application/json" },
						   datatype: "json",

						   colNames: ['Role Id', 'Role', 'IsActive','Action'],
						   colModel: [
							   { name: 'RoleId', key: true, index: 'RoleId', width: 100, stype: 'text', sorttype: 'int', hidden: true },

							   { name: 'Title', index: 'Title', width: 200, stype: 'text', sortable: true, editable: true, editrules: { required: true } },


							   { name: 'IsActive', index: 'IsActive', width: 150, editable: true, edittype: "checkbox", editoptions: { value: "true:false" }, formatter: "checkbox", formatoptions: { disabled: true } },

							   { name: 'act', index: 'act', width: 75, sortable: false },

						   ],
						   rowNum: 10,

						   mtype: 'GET',
						   loadonce: true,
						   rowList: [10, 20, 30],
						   pager: '#jQGridDemoPagerRole',
						   sortname: 'RoleId',
						   viewrecords: true,
						   height: "100%",
						   width: "400px",
						   sortorder: 'asc',
						   caption: "",

                           editurl: 'handlers/ManageRoles.ashx',

						   gridComplete: function () {
							   var ids = jQuery("#jQGridDemoRole").jqGrid('getDataIDs');
							   for (var i = 0; i < ids.length; i++) {
								   var cl = ids[i];
								   // be = "<div id='btndelcr' class='btn btn-small'  ><i class='fa fa-trash m-right-xs' onclick=\"deleteAHead('" + cl + "');\"></i> </div>";
								   //be = "<input style='height:22px;width:20px;' type='button' value='Edit' onclick=\"jQuery('#rowed2').editRow('" + cl + "');\"  />";
								   se = "<div id='btneditcrRole' class='btn btn-small' ><i class='fa fa-pencil m-right-xs' onclick=\"jQuery('#jQGridDemoRole').onSelectRow('" + cl + "');\"></i> </div>";

								   //var  ce = <div id='btnReprint' class='btn btn-small' ><i class='fa fa-edit m-right-xs'></i> Reprint</div>
								   //se = "<input style='height:22px;width:20px;' type='button' value='Delete' onclick=\"jQuery('#rowed2').restoreRow('" + cl + "');\" />";
								   jQuery("#jQGridDemoRole").jqGrid('setRowData', ids[i], { act: se });
							   }
						   },


						   ignoreCase: true,
						   toolbar: [true, "top"],


					   });


					   var $grid = $("#jQGridDemoRole");
					   // fill top toolbar
					   $('#t_' + $.jgrid.jqID($grid[0].id))
						   .append($("<div><label for=\"globalSearchText\">Global search for:&nbsp;</label><input id=\"globalSearchTextRole\" type=\"text\"></input>&nbsp;<button id=\"globalSearchRole\" type=\"button\">Search</button></div>"));
					   $("#globalSearchTextRole").keypress(function (e) {
						   var key = e.charCode || e.keyCode || 0;
						   if (key === $.ui.keyCode.ENTER) { // 13
							   $("#globalSearchRole").click();
						   }
					   });
					   $("#globalSearchRole").button({
						   icons: { primary: "ui-icon-search" },
						   text: false
					   }).click(function () {
						   var postData = $grid.jqGrid("getGridParam", "postData"),
							   colModel = $grid.jqGrid("getGridParam", "colModel"),
							   rules = [],
							   searchText = $("#globalSearchTextRole").val(),
							   l = colModel.length,
							   i,
							   cm;
						   for (i = 0; i < l; i++) {
							   cm = colModel[i];
							   if (cm.search !== false && (cm.stype === undefined || cm.stype === "text")) {
								   rules.push({
									   field: cm.name,
									   op: "cn",
									   data: searchText
								   });
							   }
						   }
						   postData.filters = JSON.stringify({
							   groupOp: "OR",
							   rules: rules
						   });
						   $grid.jqGrid("setGridParam", { search: true });
						   $grid.trigger("reloadGrid", [{ page: 1, current: true }]);
						   return false;
					   });

					   $("#globalSearchRole").button({
						   icons: { primary: "ui-icon-search" },  // This applies the jQuery UI search icon
						   text: false  // This hides the text and only shows the icon
					   });





					   $("#jQGridDemoRole").jqGrid('setGridParam',
						   {
							   onSelectRow: function (rowid, iRow, iCol, e) {
								   m_RoleId = 0;
								   
								   //validateForm("detach");
								  
								   var txtTitle = $("#txtTitleRole");
								   m_RoleId = $('#jQGridDemoRole').jqGrid('getCell', rowid, 'RoleId');




								   if ($('#jQGridDemoRole').jqGrid('getCell', rowid, 'IsActive') == "true") {
									   $('#chkIsActiveRole').prop('checked', true);
								   }
								   else {
									   $('#chkIsActiveRole').prop('checked', false);

								   }
								  
								   txtTitle.val($('#jQGridDemoRole').jqGrid('getCell', rowid, 'Title'));
								   txtTitle.focus();
								   $("#btnAddRole").css({ "display": "none" });
								   $("#btnUpdateRole").css({ "display": "inline-block" });
								   $("#btnResetRole").css({ "display": "inline-block" });
								   TakeMeTop();
							   }
						   });



					   var DataGrid = jQuery('#jQGridDemoRole');
					   DataGrid.jqGrid('setGridWidth', '500');

					   $('#jQGridDemoRole').jqGrid('navGrid', '#jQGridDemoPagerRole',
						   {
							   refresh: false,
							   edit: false,
							   add: false,
							   del: false,
							   search: false,
							   searchtext: "Search",
							   addtext: "Add",
						   },

						   {//SEARCH
							   closeOnEscape: true

						   }

					   );



				   }





			   </script>


          





				</div>
				<div role="tabpanel" class="tab-pane" id="pages">

                    <input type="hidden" id="hdnId" value="0"/>
   
  
                <div class="">
					<div class="col-md-6 col-sm-6 col-xs-12 fst-col">
						<div class="x_panel edit_manage_user fst-panel">
                                <div class="title_left">
									<h3>Membership Pages</h3>
								</div>
                                <div class="x_content">
                                                              
                                <div class="manageuser_leftform page-form">
                                        <div class="form-group">
                                            <label class="headings col-md-3 col-sm-3 col-xs-3" for="first-name">Title <span class="required">*</span>
                                            </label>
                                            <div class="col-md-9 col-sm-9 col-xs-9">
                                           <input type="text"  name="txtTitlePage" maxlength="50" class="form-control validate required alphanumeric"   data-index="1" id="txtTitlePage" />
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label class="headings col-md-3 col-sm-3 col-xs-3" for="last-name">Roles <span class="required">*</span>
                                            </label>
                                            <div class="col-md-9 col-sm-9 col-xs-9">
                                            <asp:DropDownList ID="ddlRolesPage" runat="server" data-placeholder="" multiple class="chosen-select page-select">
                                             
                                             </asp:DropDownList>
                                       
                                            </div>
                                        </div>
                                       


                                         <div class="form-group">
                                            <label class="headings col-md-3 col-sm-3 col-xs-3" for="last-name">Is Active </label>

                                            <div class="col-md-9 col-sm-9 col-xs-9">                                     
                                               <label class="check-cnt"><input type="checkbox" data-index="2" id="chkIsActivePage" checked=checked  name="chkIsActivePage" />  <span class="checkmark"></span>
								</label>
                                            </div>
                                        </div>

                                     <%--   <div class="ln_solid"></div>--%>
                                        <div class="form-group">
                                            <table >
                                            <tr>
                                           <td> <div id="btnAddPage"  class="btn btn-add btn-small" style="display:none;" ><i class="fa fa-external-link"></i> Add</div></td>
                                            <td><div id="btnUpdatePage"  class="btn btn-add btn-small" style="display:none;" ><i class="fa fa-edit m-right-xs"></i> Update Page</div></td>
                                            <td><div id="btnResetPage"  class="btn btn-del btn-small" style="display:none;" ><i class="fa fa-trash m-right-xs"></i> Cancel</div></td>
                                            
                                           
                                            </tr>
                                            </table>
                                        </div>
                        </div>
                                    
                                </div>
                            </div>
					</div>
					<div class="col-md-6 col-sm-6 col-xs-12 scn-col">
						<div class="x_panel edit_manage_user scn-panel">
                    <!--    <div class="x_title">
                            <h2>Manage Membership Pages</h2>
                             
                            <div class="clearfix"></div>
                        </div> -->
                        <div class="x_content">

                               <div class="youhave">
                    
      	          <table id="jQGridDemoPage">
    </table>

    <div id="jQGridDemoPagerPage">
    </div>
      
                    </div>

                        </div>
                    </div>
					</div>
                  
                    
                    
 
                 
                </div>
                <!-- /page content -->
       <script type="text/javascript">



		   function BindGridPage() {

			   jQuery("#jQGridDemoPage").GridUnload();

			   jQuery("#jQGridDemoPage").jqGrid({

				   url: 'handlers/ManageMembershipPages.ashx',
				   ajaxGridOptions: { contentType: "application/json" },
				   datatype: "json",

				   colNames: ['Id', 'Title', 'IsActive', 'Roles','Action'],
				   colModel: [
					   { name: 'MembershipPageId', key: true, index: 'MembershipPageId', width: 100, stype: 'text', sorttype: 'int', hidden: true },

					   { name: 'Title', index: 'Title', width: 200, stype: 'text', sortable: true, editable: true, editrules: { required: true } },

					   { name: 'IsActive', index: 'IsActive', width: 150, editable: true, edittype: "checkbox", editoptions: { value: "true:false" }, formatter: "checkbox", formatoptions: { disabled: true } },
					   { name: 'Roles', index: 'Roles', width: 200, stype: 'text', sortable: true, editable: true, hidden: true, editrules: { required: true } },
					   { name: 'act', index: 'act', width: 75, sortable: false },


				   ],
				   rowNum: 10,

				   mtype: 'GET',
				   loadonce: true,
				   rowList: [10, 20, 30],
				   pager: '#jQGridDemoPagerPage',
				   sortname: 'Bank_ID',
				   viewrecords: true,
				   height: "100%",
				   width: "400px",
				   sortorder: 'asc',
				   caption: "",

				   editurl: 'handlers/ManageMembershipPages.ashx',
				   gridComplete: function () {
					   var ids = jQuery("#jQGridDemoPage").jqGrid('getDataIDs');
					   for (var i = 0; i < ids.length; i++) {
						   var cl = ids[i];
						   // be = "<div id='btndelcr' class='btn btn-small'  ><i class='fa fa-trash m-right-xs' onclick=\"deleteAHead('" + cl + "');\"></i> </div>";
						   //be = "<input style='height:22px;width:20px;' type='button' value='Edit' onclick=\"jQuery('#rowed2').editRow('" + cl + "');\"  />";
						   se = "<div id='btneditcrPage' class='btn btn-small' ><i class='fa fa-pencil m-right-xs' onclick=\"jQuery('#jQGridDemoPage').onSelectRow('" + cl + "');\"></i> </div>";

						   //var  ce = <div id='btnReprint' class='btn btn-small' ><i class='fa fa-edit m-right-xs'></i> Reprint</div>
						   //se = "<input style='height:22px;width:20px;' type='button' value='Delete' onclick=\"jQuery('#rowed2').restoreRow('" + cl + "');\" />";
						   jQuery("#jQGridDemoPage").jqGrid('setRowData', ids[i], { act: se });
					   }
				   },
				   ignoreCase: true,
				   toolbar: [true, "top"],


			   });


			   var $grid = $("#jQGridDemoPage");
			   // fill top toolbar
			   $('#t_' + $.jgrid.jqID($grid[0].id))
				   .append($("<div><label for=\"globalSearchTextPage\">Global search for:&nbsp;</label><input id=\"globalSearchTextPage\" type=\"text\"></input>&nbsp;<button id=\"globalSearchPage\" type=\"button\">Search</button></div>"));
			   $("#globalSearchTextPage").keypress(function (e) {
				   var key = e.charCode || e.keyCode || 0;
				   if (key === $.ui.keyCode.ENTER) { // 13
					   $("#globalSearchPage").click();
				   }
			   });
			   $("#globalSearchPage").button({
				   icons: { primary: "ui-icon-search" },
				   text: false
			   }).click(function () {
				   var postData = $grid.jqGrid("getGridParam", "postData"),
					   colModel = $grid.jqGrid("getGridParam", "colModel"),
					   rules = [],
					   searchText = $("#globalSearchTextPage").val(),
					   l = colModel.length,
					   i,
					   cm;
				   for (i = 0; i < l; i++) {
					   cm = colModel[i];
					   if (cm.search !== false && (cm.stype === undefined || cm.stype === "text")) {
						   rules.push({
							   field: cm.name,
							   op: "cn",
							   data: searchText
						   });
					   }
				   }
				   postData.filters = JSON.stringify({
					   groupOp: "OR",
					   rules: rules
				   });
				   $grid.jqGrid("setGridParam", { search: true });
				   $grid.trigger("reloadGrid", [{ page: 1, current: true }]);
				   return false;
			   });


			   $("#jQGridDemoPage").jqGrid('setGridParam',
				   {
					   onSelectRow: function (rowid, iRow, iCol, e) {

						  // validateForm("detach");
						   var txtTitle = $("#txtTitlePage");


						   var arrRole = [];
						   arrRole = $("#<%=hdnRoles.ClientID%>").val().split(',');


						   $("#btnUpdatePage").css({ "display": "none" });
						   $("#btnResetPage").css({ "display": "none" });
						   $("#btnAddPage").css({ "display": "none" });


			   for (var i = 0; i < arrRole.length; i++) {

				   if (arrRole[i] == 1) {

					   $("#btnAddPage").css({ "display": "block" });
				   }

				   if (arrRole[i] == 3) {
					  
					   $("#hdnId").val($('#jQGridDemoPage').jqGrid('getCell', rowid, 'MembershipPageId'));

					   var strRoles = $('#jQGridDemoPage').jqGrid('getCell', rowid, 'Roles');
					   var parts = strRoles.split(',');

					   $("#<%=ddlRolesPage.ClientID %> > option").attr("selected", false);

							  for (var i = 0; i < parts.length; i++) {

								  $('#<%=ddlRolesPage.ClientID %> option[value=' + parts[i] + ']').prop('selected', 'selected');
							  }
							  $("#<%=ddlRolesPage.ClientID %>").trigger("chosen:updated");



					   if ($('#jQGridDemoPage').jqGrid('getCell', rowid, 'IsActive') == "true") {
										  $('#chkIsActivePage').prop('checked', true);
									  }
									  else {
										  $('#chkIsActivePage').prop('checked', false);

									  }
					   txtTitle.val($('#jQGridDemoPage').jqGrid('getCell', rowid, 'Title'));
									  txtTitle.focus();
					   $("#btnAddPage").css({ "display": "none" });
					   $("#btnUpdatePage").css({ "display": "block" });
					   $("#btnResetPage").css({ "display": "block" });
								  }

							  }
							  TakeMeTop();
						  }
					  });

			   var DataGrid = jQuery('#jQGridDemoPage');
			   DataGrid.jqGrid('setGridWidth', '500');

			   $('#jQGridDemoPage').jqGrid('navGrid', '#jQGridDemoPagerPage',
				   {
					   refresh: false,
					   edit: false,
					   add: false,
					   del: false,
					   search: false,
					   searchtext: "Search",
					   addtext: "Add",
				   },

				   {//SEARCH
					   closeOnEscape: true

				   }

			   );



		   }





    </script>


	  
  <script language="javascript">

	  doChosen();
	  function doChosen() {

		  var config = {
			  '.chosen-select': {},
			  '.chosen-select-deselect': { allow_single_deselect: true },
			  '.chosen-select-no-single': { disable_search_threshold: 10 },
			  '.chosen-select-no-results': { no_results_text: 'Oops, nothing found!' },
			  '.chosen-select-width': { width: "95%" }
		  }
		  for (var selector in config) {
			  $(selector).chosen(config[selector]);
		  }

	  }


	  function ApplyRoles(Roles) {
		 
		  $("#<%=hdnRoles.ClientID%>").val(Roles);
	  }
	  function ResetControlsPage() {
		  var txtTitle = $("#txtTitlePage");
		  var btnAdd = $("#btnAddPage");
		  var btnUpdate = $("#btnUpdatePage");
		  $("#<%=ddlRolesPage.ClientID %> > option").attr("selected", false);
		  $("#<%=ddlRolesPage.ClientID %>").trigger("chosen:updated");
		  txtTitle.focus();
		  txtTitle.val("");
		  txtTitle.focus();
		  var arrRole = [];
		  arrRole = $("#<%=hdnRoles.ClientID%>").val().split(',');
		  btnAdd.css({ "display": "none" });
		  for (var i = 0; i < arrRole.length; i++) {
			  if (arrRole[i] == "1") {

				  $("#btnAddPage").css({ "display": "block" });

			  }

		  }


		  $("#btnUpdatePage").css({ "display": "none" });


		  $("#btnResetPage").css({ "display": "none" });
		  $("#chkIsActivePage").prop("checked", "checked");



		  $("#hdnId").val("0");

	  }



	  function TakeMeTop() {
		  $("html, body").animate({ scrollTop: 0 }, 500);
	  }

	  function RefreshGrid() {
		  $('#jQGridDemoPage').trigger('reloadGrid');

	  }

	  function InsertUpdatePage() {


		  var btnAdd = $("#btnAddPage");
		  var btnUpdate = $("#btnUpdatePage");

		  var Id = $("#hdnId").val();


		  var Title = $("#txtTitlePage").val();
		  if ($.trim(Title) == "") {
			  $("#txtTitlePage").focus();
			  //alert("Please enter Title");
			  return;
		  }

		 // $.uiLock('');
		  if (Id == "0") {
			  btnAdd.unbind('click');
		  }
		  else {
			  btnUpdate.unbind('click');
		  }



		  var IsActive = false;


		  if ($('#chkIsActivePage').is(":checked")) {
			  IsActive = true;
		  }
		  var arrRoles = $('#<%=ddlRolesPage.ClientID %>').val();



		  $.ajax({
			  type: "POST",
			  data: '{"id":"' + Id + '", "title": "' + Title + '","isActive": "' + IsActive + '","arrRoles":"' + arrRoles + '"}',
			  url: "managepages.aspx/Insert",
			  contentType: "application/json",
			  dataType: "json",
			  success: function (msg) {

				  var obj = jQuery.parseJSON(msg.d);

				  if (obj.Status == 0) {
					  ResetControlsPage();

					  if (Id == "0") {
						  btnAdd.bind('click', function () { InsertUpdatePage(); });
					  }
					  else {

						  btnUpdate.bind('click', function () { InsertUpdatePage(); });
					  }


					  alert("Insertion Failed.MembershipPage with duplicate name already exists.");
					  return;

				  }



				  if (obj.Status == -11) {
					  alert("You don't have permission to perform this action..Consult Admin Department.");
					  return;
				  }

				  if (Id == "0") {
					  btnAdd.bind('click', function () { InsertUpdatePage(); });

					  jQuery("#jQGridDemoPage").jqGrid('addRowData', obj.MembershipPage.MembershipPageId, obj.MembershipPage, "last");



					  ResetControlsPage();

					  alert("MembershipPage added successfully.");

				  }
				  else {

					  btnUpdate.bind('click', function () { InsertUpdatePage(); });

					  var myGrid = $("#jQGridDemoPage");
					  var selRowId = myGrid.jqGrid('getGridParam', 'selrow');


					  myGrid.jqGrid('setRowData', selRowId, obj.MembershipPage);

					  alert("MembershipPage Updated successfully.");
					  ResetControlsPage();

				  }

			  },
			  error: function (xhr, ajaxOptions, thrownError) {

				  var obj = jQuery.parseJSON(xhr.responseText);
				  alert(obj.Message);
			  },
			  complete: function () {
				  $.uiUnlock();

			  }



		  });

	  }




	  $(document).ready(
		  function () {

			 
			  $('#txtTitlePage').focus();
			  $('#txtTitlePage').keypress(function (event) {


				 var keycode = (event.keyCode ? event.keyCode : event.which);

				 if (keycode == '13') {

					 InsertUpdatePage();
				 }


			 });


			


		 }
	 );





 </script>




            <script type="text/javascript">
				var config = {
					'.chosen-select': {},
					'.chosen-select-deselect': { allow_single_deselect: true },
					'.chosen-select-no-single': { disable_search_threshold: 10 },
					'.chosen-select-no-results': { no_results_text: 'Oops, nothing found!' },
					'.chosen-select-width': { width: "95%" }
				}
				for (var selector in config) {
					$(selector).chosen(config[selector]);
				}

  </script>
               






				</div>
				<div role="tabpanel" class="tab-pane" id="applyroles">
 
                <div class="">

                 
                    <div class="row manage-apply-roles-row">
                        <div class="col-md-12 col-sm-12 col-xs-12">


                        
                            <div class="x_panel edit_manage_user fst-panel">
                                
								 <div class="title_left">
                            <h3>Apply Roles</h3>
                        </div>
                                <div class="x_content">

                                    <div class="manageuser_leftform">
                                   
                    
                    	<div class="form-group">
										<label class="headings col-md-3 col-sm-3 col-xs-4">Choose Designation</label>
										<div class="col-md-9 col-sm-9 col-xs-8">
										
                                        <select id="ddlDesignation" style="height:25px;width:200px"></select>
										</div>
									</div>
                    
                    
                        			<div class="form-group">
										<label class="headings">Roles:</label>
										<div class="controls">
										 
                                               <div id="dvDesRoles" style="max-height:500px;overflow-y:scroll;width:300px">
                                               
                                               </div>

                                           
										
                                        </div>
									</div>
									



                                    <div class="form-group">
									
                                      
 	<table>
                                    <tr>
                                    <td><div id="btnAddApp"  class="btn btn-add btn-small"  style="height:30px" >Assign Roles</div>
   </td>
      
        

                                    </tr>
                                    </table>

                                        </div>


                                        
                                    </div>
                                </div>
                            </div>
									 
                        </div>
                    </div>
 
                 
                </div>
                <!-- /page content -->

				</div>

				 <script language="javascript">


					 function ShowHide(val) {
						 $("#tr" + val).slideToggle(50);
						 var img = $("#imgShowHide" + val);
						 var url = $(img).attr("src");
						 if (url == "images/icoplus.gif") {
							 $(img).attr("src", "images/icominus.gif");
						 }
						 else {
							 $(img).attr("src", "images/icoplus.gif");
						 }
					 }

					
					 function TakeMeTop() {
						 $("html, body").animate({ scrollTop: 0 }, 500);
					 }

					 function RefreshGrid() {
						 $('#jQGridDemo').trigger('reloadGrid');

					 }

					 $(document).ready(
						 function () {

							 $("#btnAddApp").click(
								 function () {
									 var btnAdd = $("#btnAddApp");
									

									 btnAdd.html("<img src='images/loader.gif' alt='loading...'/>")

									 var Pid = [];
									 var Rid = [];
									 var Did = $("#ddlDesignation").val();

									 $("input[name='Roles']:checked").each(
										 function (x) {

											 var pageId = $(this).attr("pid");
											 var roleId = $(this).val();

											 Pid[x] = pageId;
											 Rid[x] = roleId;

										 }

									 );


									 
									 $.ajax({
										 type: "POST",
										 data: '{"Pid":"' + Pid + '", "Rid": "' + Rid + '","Did": "' + Did + '"}',
										 url: "manageapplyroles.aspx/Insert",
										 contentType: "application/json",
										 dataType: "json",
										 success: function (msg) {
											 btnAdd.html('Assign Roles');

											 var obj = jQuery.parseJSON(msg.d);
											 
											 if (obj.Status == "1") {
												 alert("Roles Assigned Successfully");
											 }
											 else {
												 alert("Operation Failed");
											 }

										 },
										 error: function (xhr, ajaxOptions, thrownError) {
											 btnAdd.html('Assign Roles');

											 var obj = jQuery.parseJSON(xhr.responseText);
											 alert(obj.Message);
										 },
										 complete: function () {
											 $.uiUnlock();

										 }



									 });



								 }
							 );

							 $("#ddlDesignation").change(
								 function () {
									 $("#dvDesRoles").html("");
									// $.uiLock('');
									 $.ajax({
										 type: "POST",
										 data: '{"designationId":"' + $(this).val() + '"}',
										 url: "manageapplyroles.aspx/GetRolesByDesignation",
										 contentType: "application/json",
										 dataType: "json",
										 success: function (msg) {

											 var obj = jQuery.parseJSON(msg.d);


											 $("#dvDesRoles").html(obj.Data);



										 },
										 error: function (xhr, ajaxOptions, thrownError) {

											 var obj = jQuery.parseJSON(xhr.responseText);
											 alert(obj.Message);
										 },
										 complete: function () {

											 $.uiUnlock();

										 }



									 });



								 }
							 );


							 $.ajax({
								 type: "POST",
								 data: '{}',
								 url: "manageapplyroles.aspx/GetDesignations",
								 contentType: "application/json",
								 dataType: "json",
								 success: function (msg) {

									 var obj = jQuery.parseJSON(msg.d);


									 $("#ddlDesignation").html(obj.DesignationOptions);



								 },
								 error: function (xhr, ajaxOptions, thrownError) {

									 var obj = jQuery.parseJSON(xhr.responseText);
									 alert(obj.Message);
								 },
								 complete: function () {

									 $.uiUnlock();
								 }



							 });

                             $.ajax({
                                 type: "POST",
                                 data: '{}',
                                 url: "manageapplyroles.aspx/GetLocations",
                                 contentType: "application/json",
                                 dataType: "json",
                                 success: function (msg) {

                                     var obj = jQuery.parseJSON(msg.d);


                                     $("#ddlDesignation").html(obj.DesignationOptions);



                                 },
                                 error: function (xhr, ajaxOptions, thrownError) {

                                     var obj = jQuery.parseJSON(xhr.responseText);
                                     alert(obj.Message);
                                 },
                                 complete: function () {

                                     $.uiUnlock();
                                 }



                             });


							 $("#btnAddApp").click(
								 function () {
									 
									 InsertUpdate();


								 }
							 );

							 
						 }
					 );

                 </script>
				

			</div>
         


        </div>




       
              </form>
    </asp:Content>