Create Form User – Tutorial Build Point Of Sale With PHP, PDO, MySQL And Jquery Part 3.

Continuing my article Tutorial Build Point Of Sale System With PHP, PDO, MySQL And Jquery. If previously I have discussed how to create a login form and dynamic menu adminLTE. In section 3 will create a master user page, which is used to add, edit and delete user data. To start this section, you should read the previous tutorials part 1 and part 2:

Tutorial Build Point Of Sale With PHP, PDO, MySQL And Jquery Part 1.
Dynamic Menu AdminLTE And Dashboard Page – Tutorial Build Point Of Sale With PHP, PDO, MySQL And Jquery Part 2.

Okay, let’s start the tutorial to create a master user form with PHP and adminLTE Template

I’ve discussed how to create a user permission to set the user’s access menu in the article https://seegatesite.com/how-to-create-user-permissions-view-to-dynamic-sidebar-menu-adminlte/. I will discuss it again by creating a user form menu so we can better understand it.

Add 3 new files in the “utility” folder (post/application/utility): c_mstuser.php, j_mstuser.js, v_mstuser.php. Fill in the following script on each file

v_mstuser.php

<?php 
$titlepage="Master User";
$idsmenu=3;
include "../../library/config.php";
require_ once("../model/dbconn.php");
require_ once("../model/pos.php");
include "../layout/top-header.php"; 
include "../../library /check_login.php";
include "../../library /check_access.php";
include "../layout/header.php"; ?>

<section class="content">
  <div class="box box-success">
    <div class="box-header with-border">
      <h3 class="box-title">Master User</h3>
    </div><!--./ box header-->
    <div class="box-body">
      <button type="submit" class="btn btn-primary " id="btnadd" name="btnadd"><i class="fa fa-plus"></i> Add User</button>
      <br>
      <div class="box-body table-responsive no-padding">
        <table id="table_user" class="table  table-bordered table-hover ">
          <thead>
            <tr class="tableheader">
              <th style="width:30px">#</th>
              <th style="width:100px">Username</th>
              <th style="width:200px">Level</th>
              <th style="width:150px"></th>
            </tr>
          </thead>
          <tbody></tbody>
        </table>
      </div>
    </div>
  </div><!-- /.box -->
</section><!-- /.content -->
<div id="modalmasteruser" class="modal fade ">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">×</button>
        <h4 class="modal-title">Master user Form</h4>
      </div>
      <!--modal header-->
      <div class="modal-body">
        <div class="form-horizontal">
          <div class="box-body">
            <div class="form-group">
              <label class="col-sm-2  control-label">Username</label>
              <div class="col-sm-6">
                <input type="text" class="form-control text-uppercase" id="txtusername" name="" value="" placeholder="">
                <input type="hidden" id="txtiduser" name="inputcrud" class="" value="0">
                <input type="hidden" id="inputcrud" name="inputcrud" class="" value="N">
                <input type="hidden" id="hmenu" name="" class="" value=""> </div>
              </div>
              <div class="form-group">
                <label class="col-sm-2  control-label">Password</label>
                <div class="col-sm-6">
                  <input type="password" class="form-control " id="txtpass" name="" value="" placeholder=""> </div>
                </div>
              </div>
            </div>
            <!--form menuk-->
            <?php
            $pos = new pos();
            $mymenu = $pos->getMenu();
            $num=1;
            $menuku='';
            foreach ($mymenu[1] as $key) {
              if($num==1)
              {
                $menuku .= '<div class="row" >';
                $menuku .= '<div class="col-xs-6" style="padding-left:0px"><h4>'.$key['name_menu'].'</h4>';
                $submenuk = $pos->getSubMenu($key['id_menu']);
                $menuku .= '<ul class="list-group">'; 
                foreach ($submenuk[1] as $keys) {
                  $menuku .= '<li class="list-group-item">
                  <input type="checkbox"  id="check-'.$keys["id_sub_menu"].'" class="chkbox" value="'.$keys['id_sub_menu'].'" > <strong>'.$keys['name_sub_menu'].'</strong>
                  </li>'; 
                }
                $menuku .= '</ul>'; 
                $menuku .= '</div>';
              }else{
                $menuku .= '<div class="col-xs-6" style="padding-left:0px"><h4>'.$key['name_menu'].'</h4>';
                $submenuk = $pos->getSubMenu($key['id_menu']);
                $menuku .= '<ul class="list-group">'; 
                foreach ($submenuk[1] as $keys) {
                  $menuku .= '<li class="list-group-item"><input type="checkbox" id="check-'.$keys["id_sub_menu"].'" class="chkbox" value="'.$keys['id_sub_menu'].'" > <strong>'.$keys['name_sub_menu'].'</strong></li>'; 
                }
                $menuku .= '</ul>';
                $menuku .= '</div>';
                $menuku .= '</div>';
                $num=0;
              }
              $num++;
            }
            ?>
            <div class="form-horizontal menuk" >
              <div class="box-body">
                <div class="form-group">  
                  <label class="col-sm-2  control-label">Menu Access</label> 
                  <div class="col-xs-10">
                    <div>
                      <input type="checkbox" id="check-all" class="txtcheckbox2"> <b>Selected All</b>
                    </div>
                    <?php echo $menuku; ?>
                  </div> 
                </div>
              </div>
            </div> 
            <div class="form-horizontal">
              <div class="box-body">
                <div class="form-group">   
                  <label class="col-sm-2  control-label"></label>
                  <div class="col-sm-6">
                    <button type="submit" class="btn btn-primary " id="btnsaveuser" name="btnsaveuser"><i class="fa fa-save"></i> Save</button>
                  </div>  
                </div>
              </div>
            </div>
            <!--end form menuk-->
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          </div>
          <!--modal footer-->
        </div>
        <!--modal-content-->
      </div>
      <!--modal-dialog modal-lg-->
    </div>
    <!--form-kantor-modal-->
  </div>

  <!-- modal dialog untuk password -->
  <div id="passwordmodal" class="modal fade ">
    <div class="modal-dialog modal-md">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">×</button>
          <h4 class="modal-title">Reset Password</h4>
        </div><!--modal header--> 
        <div class="modal-body"><div class="form-horizontal"><div class="box-body"><div class="form-group">   <label class="col-sm-3  control-label">Reset Password</label>   <div class="col-sm-9"><input type="password" class="form-control " id="txtresetpass" name="txtresetpass" value="" placeholder=""><input type="hidden" id="txthiduser" name="" class="" value="">    </div>  </div><div class="form-group">   <label class="col-sm-3  control-label"><button type="submit" class="btn btn-primary " id="btnresetpassword" name="btnresetpassword"><i class="fa  fa-key"></i> Reset Password</button> <span id="infopassword"></span></label>   <div class="col-sm-9">    </div>  </div></div></div></div><div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div><!--modal footer-->
    </div><!--modal-content-->
  </div><!--modal-dialog modal-lg-->
</div>
<!-- end modal -->
<?php include "../layout/footer.php"; //footer template ?> 
<?php include "../layout/bottom-footer.php"; //footer template ?> 
<script src="../../plugins/datepicker/bootstrap-datepicker.js"></script>
<script src="j_mstuser.js"></script>

</body>
</html>

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

<?php

$titlepage="Master User";

$idsmenu=3;

include "../../library/config.php";

require_ once("../model/dbconn.php");

require_ once("../model/pos.php");

include "../layout/top-header.php";

include "../../library /check_login.php";

include "../../library /check_access.php";

include "../layout/header.php"; ?>

<h3 class="box-title">Master User</h3>

</div>

<br>

<thead>

<th style="width:100px">Username</th>

<th style="width:200px">Level</th>

</tr>

</thead>

</table>

</div>

</div>

</section>

<h4 class="modal-title">Master user Form</h4>

</div>

<label class="col-sm-2 control-label">Username</label>

</div>

<label class="col-sm-2 control-label">Password</label>

</div>

<?php

$pos = new pos();

$mymenu = $pos->getMenu();

$num=1;

$menuku='';

foreach ($mymenu[1] as $key) {

if($num==1)

{

$menuku .= '<div class="row" >';

$menuku .= '<div class="col-xs-6" style="padding-left:0px"><h4>'.$key['name_menu'].'</h4>';

$submenuk = $pos->getSubMenu($key['id_menu']);

$menuku .= '<ul class="list-group">';

foreach ($submenuk[1] as $keys) {

$menuku .= '<li class="list-group-item">

</li>';

}

$menuku .= '</ul>';

$menuku .= '</div>';

}else{

$menuku .= '<div class="col-xs-6" style="padding-left:0px"><h4>'.$key['name_menu'].'</h4>';

$submenuk = $pos->getSubMenu($key['id_menu']);

$menuku .= '<ul class="list-group">';

foreach ($submenuk[1] as $keys) {

$menuku .= '<li class="list-group-item"><input type="checkbox" id="check-'.$keys["id_sub_menu"].'" class="chkbox" value="'.$keys['id_sub_menu'].'" > <strong>'.$keys['name_sub_menu'].'</strong></li>';

}

$menuku .= '</ul>';

$menuku .= '</div>';

$num=0;

}

$num++;

}

<label class="col-sm-2 control-label">Menu Access</label>

<div>

<input type="checkbox" id="check-all" class="txtcheckbox2"> <b>Selected All</b>

</div>

<?php echo $menuku; ?>

</div>

</div>

</div>

<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>

</div>

</div>

</div>

</div>

</div>

<h4 class="modal-title">Reset Password</h4>

</div>

<div class="modal-body"><div class="form-horizontal"><div class="box-body"><div class="form-group"> <label class="col-sm-3 control-label">Reset Password</label> <div class="col-sm-9"><input type="password" class="form-control " id="txtresetpass" name="txtresetpass" value="" placeholder=""><input type="hidden" id="txthiduser" name="" class="" value=""> </div> </div><div class="form-group"> <label class="col-sm-3 control-label"><button type="submit" class="btn btn-primary " id="btnresetpassword" name="btnresetpassword"><i class="fa fa-key"></i> Reset Password</button> <span id="infopassword"></span></label> <div class="col-sm-9"> </div> </div></div></div></div><div class="modal-footer">

<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>

</div>

</div>

</div>

</div>

<?php include "../layout/footer.php"; //footer template ?>

<?php include "../layout/bottom-footer.php"; //footer template ?>

</body>

</html>

j_mstuser.js

$(document).ready( function () 
{
  var value = {
    method : "getdata"
  };
  $('#table_user').DataTable({
    "paging": false,
    "lengthChange": false,
    "searching": false,
    "ordering": false,
    "info": false,
    "responsive": true,
    "autoWidth": false,
    "pageLength": 50,
    "dom": '<"top"f>rtip',
    "ajax": {
      "url": "c_mstuser.php",
      "type": "POST",
      "data":value,
    },
    "columns": [
    { "data": "id_user" },
    { "data": "username" },
    { "data": "h_menu" },
    { "data": "button" },
    ]
  });
});


$(document).on("click","#check-all",function(){
  if ($(this).is(':checked')){
    $('.chkbox:enabled').prop('checked', true);
  }else{
    $('.chkbox').prop('checked', false);
  }
  get_check_value();
});
$(document).on("click",".chkbox",function(){
  get_check_value();
});
function get_check_value(){
  var values = [];
  $('.chkbox:checked').each(function() {
    values.push($(this).val());
  });
  $('#hmenu').val(values.join(','));
}
$(document).on( "click","#btnadd", function() {
  $("#modalmasteruser").modal('show');
  $("#txtiduser").val(0);
  $("#txtusername").val("");
  $("#inputcrud").val("N");
  set_focus("#txtusername");
});

$(document).on( "click",".btnedit", function() {

  var id_user = $(this).attr("id_user");
  var username = $(this).attr("username");
  var h_menu = $(this).attr("h_menu");
  $("#inputcrud").val("E");
  $("#txtiduser").val(id_user);
  $("#txtusername").val(username);
  $("#txtpass").val("***********");
  $("#hmenu").val(h_menu);
  $('.chkbox').prop('checked', false);
  var res = h_menu.split(",");
  for (i = 0; i < res.length; i++) { 
   $("#check-"+res[i]).prop('checked', true);
 }
 $("#modalmasteruser").modal('show');
 set_focus("#txtusername");
});


$(document).on( "click","#btnsaveuser", function() {
  var id_user = $("#txtiduser").val();
  var username=$("#txtusername").val();
  var pass_user=$("#txtpass").val();
  var hmenu=$("#hmenu").val();
  var crud=$("#inputcrud").val()
  if(username == '' || username== null ){
    $.notify({
      message: "Please fill out username!"
    },{
      type: 'warning',
      delay: 10000,
    });
    $("#txtusername").focus();
    return;
  }
  if(username.toUpperCase()== 'ADMIN' ){
    $.notify({
      message: "Please Do Not use 'ADMIN' as username"
    },{
      type: 'warning',
      delay: 10000,
    });
    $("#txtusername").focus();
    return;
  }
  if(pass_user == '' || pass_user == null ){
    $.notify({
      message: "Please fill out password"
    },{
      type: 'warning',
      delay: 10000,
    });
    $("#txtpass").focus();
    return;
  }
  var value = {
    id_user: id_user,
    username: username,
    pass_user:pass_user,
    h_menu : hmenu,
    crud:crud,
    method : "save_user"
  };
  $("#btnsaveuser").prop('disabled', true);
  proccess_waiting("#infoproses");
  $.ajax(
  {
    url : "c_mstuser.php",
    type: "POST",
    data : value,
    success: function(data, textStatus, jqXHR)
    {
      $("#btnsaveuser").prop('disabled', false);
      $("#infoproses").html("");
      var data = jQuery.parseJSON(data);
      if(data.crud == 'N'){
        if(data.result == true){
          $.notify("Save new user successfully");
          var table = $('#table_user').DataTable(); 
          table.ajax.reload( null, false );
          $("#txtiduser").val("");
          $("#txtusername").val("");
          $("#pass_user").val("");
          set_focus("#txtusername");

        }else{
          $.notify({
            message: "Error save new user , Error : "+data.error 
          },{
            type: 'danger',
            delay: 10000,
          });
          set_focus("#txtusername");
        }
      }else if(data.crud == 'E'){
        if(data.result == true){
          $.notify("Update user successfully");
          var table = $('#table_user').DataTable(); 
          table.ajax.reload( null, false );
          $("#modalmasteruser").modal("hide");

        }else{
          $.notify({
            message: "Error save new user , Error : "+data.error 
          },{
            type: 'danger',
            delay: 10000,
          });
          set_focus("#txtiduser");
        }
      }else{
        $.notify({
          message: "Invalid Order!" 
        },{
          type: 'danger',
          delay: 10000,
        });
      }
    },
    error: function(jqXHR, textStatus, errorThrown)
    {
      $("#btnsaveuser").prop('disabled', false);
      
    }
  });
});


$(document).on("click",".btnpass",function(){
  var id_user = $(this).attr("id_user");
  $("#txthiduser").val(id_user);
  $("#passwordmodal").modal("show");
  set_focus("#txtresetpass");
})

$(document).on("click","#btnresetpassword",function(){
 var id_user = $("#txthiduser").val();
 var new_pass = $("#txtresetpass").val();
 swal({   
  title: "Reset Password",   
  text: "Reset Password?",   
  type: "warning",   
  showCancelButton: true,   
  confirmButtonColor: "#DD6B55",   
  confirmButtonText: "Reset",   
  closeOnConfirm: true }, 
  function(){   
    var value = {
      id_user: id_user,
      new_pass : new_pass,
      crud:'D',
      method : "reset_password"
    };
    $.ajax(
    {
      url : "c_mstuser.php",
      type: "POST",
      data : value,
      success: function(data, textStatus, jqXHR)
      {
        var data = jQuery.parseJSON(data);
        if(data.result == true){
          $.notify("Reset password successfully");
          $("#passwordmodal").modal("hide");
        }else{
          $.notify({
            message: "Error reset password , Error : "+data.error 
          },{
            type: 'danger',
            delay: 10000,
          });
        }

      },
      error: function(jqXHR, textStatus, errorThrown)
      {
        $.notify({
          message:  "Error : "+textStatus
        },{
          type: 'danger',
          delay: 10000,
        });
      }
    });
  });
})

$(document).on( "click",".btndelete", function() {
  var id_user = $(this).attr("id_user");
  swal({   
    title: "Delete ",   
    text: "Delete user with id : "+id_user+" ?",   
    type: "warning",   
    showCancelButton: true,   
    confirmButtonColor: "#DD6B55",   
    confirmButtonText: "Delete",   
    closeOnConfirm: true }, 
    function(){   
      var value = {
        id_user: id_user,
        crud:'D',
        method : "delete_user"
      };
      $.ajax(
      {
        url : "c_mstuser.php",
        type: "POST",
        data : value,
        success: function(data, textStatus, jqXHR)
        {
          var data = jQuery.parseJSON(data);
          if(data.result == true){
            $.notify("Delete user successfully");
            var table = $('#table_user').DataTable(); 
            table.ajax.reload( null, false );
          }else{
            $.notify({
              message: "Error delete user , Error : "+data.error 
            },{
              type: 'danger',
              delay: 10000,
            });
          }
          
        },
        error: function(jqXHR, textStatus, errorThrown)
        {
          $.notify({
            message:  "Error : "+textStatus
          },{
            type: 'danger',
            delay: 10000,
          });
        }
      });
    });
});

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

277

278

279

280

281

282

283

284

285

286

287

288

289

290

291

292

293

294

$(document).ready( function ()

{

var value = {

method : "getdata"

};

$('#table_user').DataTable({

"paging": false,

"lengthChange": false,

"searching": false,

"ordering": false,

"info": false,

"responsive": true,

"autoWidth": false,

"pageLength": 50,

"dom": '<"top"f>rtip',

"ajax": {

"url": "c_mstuser.php",

"type": "POST",

"data":value,

"columns": [

{ "data": "id_user" },

{ "data": "username" },

{ "data": "h_menu" },

{ "data": "button" },

]

});

$(document).on("click","#check-all",function(){

if ($(this).is(':checked')){

$('.chkbox:enabled').prop('checked', true);

}else{

$('.chkbox').prop('checked', false);

}

get_check_value();

});

$(document).on("click",".chkbox",function(){

get_check_value();

});

function get_check_value(){

var values = [];

$('.chkbox:checked').each(function() {

values.push($(this).val());

});

$('#hmenu').val(values.join(','));

}

$(document).on( "click","#btnadd", function() {

$("#modalmasteruser").modal('show');

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

$("#txtusername").val("");

$("#inputcrud").val("N");

set_focus("#txtusername");

});

$(document).on( "click",".btnedit", function() {

var id_user = $(this).attr("id_user");

var username = $(this).attr("username");

var h_menu = $(this).attr("h_menu");

$("#inputcrud").val("E");

$("#txtiduser").val(id_user);

$("#txtusername").val(username);

$("#txtpass").val("***********");

$("#hmenu").val(h_menu);

$('.chkbox').prop('checked', false);

var res = h_menu.split(",");

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

$("#check-"+res[i]).prop('checked', true);

}

$("#modalmasteruser").modal('show');

set_focus("#txtusername");

});

$(document).on( "click","#btnsaveuser", function() {

var id_user = $("#txtiduser").val();

var username=$("#txtusername").val();

var pass_user=$("#txtpass").val();

var hmenu=$("#hmenu").val();

var crud=$("#inputcrud").val()

if(username == '' || username== null ){

$.notify({

message: "Please fill out username!"

},{

type: 'warning',

delay: 10000,

});

$("#txtusername").focus();

return;

}

if(username.toUpperCase()== 'ADMIN' ){

$.notify({

message: "Please Do Not use 'ADMIN' as username"

},{

type: 'warning',

delay: 10000,

});

$("#txtusername").focus();

return;

}

if(pass_user == '' || pass_user == null ){

$.notify({

message: "Please fill out password"

},{

type: 'warning',

delay: 10000,

});

$("#txtpass").focus();

return;

}

var value = {

id_user: id_user,

username: username,

pass_user:pass_user,

h_menu : hmenu,

crud:crud,

method : "save_user"

};

$("#btnsaveuser").prop('disabled', true);

proccess_waiting("#infoproses");

$.ajax(

{

url : "c_mstuser.php",

type: "POST",

data : value,

success: function(data, textStatus, jqXHR)

{

$("#btnsaveuser").prop('disabled', false);

$("#infoproses").html("");

var data = jQuery.parseJSON(data);

if(data.crud == 'N'){

if(data.result == true){

$.notify("Save new user successfully");

var table = $('#table_user').DataTable();

table.ajax.reload( null, false );

$("#txtiduser").val("");

$("#txtusername").val("");

$("#pass_user").val("");

set_focus("#txtusername");

}else{

$.notify({

message: "Error save new user , Error : "+data.error

},{

type: 'danger',

delay: 10000,

});

set_focus("#txtusername");

}

}else if(data.crud == 'E'){

if(data.result == true){

$.notify("Update user successfully");

var table = $('#table_user').DataTable();

table.ajax.reload( null, false );

$("#modalmasteruser").modal("hide");

}else{

$.notify({

message: "Error save new user , Error : "+data.error

},{

type: 'danger',

delay: 10000,

});

set_focus("#txtiduser");

}

}else{

$.notify({

message: "Invalid Order!"

},{

type: 'danger',

delay: 10000,

});

}

error: function(jqXHR, textStatus, errorThrown)

{

$("#btnsaveuser").prop('disabled', false);

}

});

$(document).on("click",".btnpass",function(){

var id_user = $(this).attr("id_user");

$("#txthiduser").val(id_user);

$("#passwordmodal").modal("show");

set_focus("#txtresetpass");

})

$(document).on("click","#btnresetpassword",function(){

var id_user = $("#txthiduser").val();

var new_pass = $("#txtresetpass").val();

swal({

title: "Reset Password",

text: "Reset Password?",

type: "warning",

showCancelButton: true,

confirmButtonColor: "#DD6B55",

confirmButtonText: "Reset",

closeOnConfirm: true },

function(){

var value = {

id_user: id_user,

new_pass : new_pass,

crud:'D',

method : "reset_password"

};

$.ajax(

{

url : "c_mstuser.php",

type: "POST",

data : value,

success: function(data, textStatus, jqXHR)

{

var data = jQuery.parseJSON(data);

if(data.result == true){

$.notify("Reset password successfully");

$("#passwordmodal").modal("hide");

}else{

$.notify({

message: "Error reset password , Error : "+data.error

},{

type: 'danger',

delay: 10000,

});

}

error: function(jqXHR, textStatus, errorThrown)

{

$.notify({

message: "Error : "+textStatus

},{

type: 'danger',

delay: 10000,

});

}

});

})

$(document).on( "click",".btndelete", function() {

var id_user = $(this).attr("id_user");

swal({

title: "Delete ",

text: "Delete user with id : "+id_user+" ?",

type: "warning",

showCancelButton: true,

confirmButtonColor: "#DD6B55",

confirmButtonText: "Delete",

closeOnConfirm: true },

function(){

var value = {

id_user: id_user,

crud:'D',

method : "delete_user"

};

$.ajax(

{

url : "c_mstuser.php",

type: "POST",

data : value,

success: function(data, textStatus, jqXHR)

{

var data = jQuery.parseJSON(data);

if(data.result == true){

$.notify("Delete user successfully");

var table = $('#table_user').DataTable();

table.ajax.reload( null, false );

}else{

$.notify({

message: "Error delete user , Error : "+data.error

},{

type: 'danger',

delay: 10000,

});

}

error: function(jqXHR, textStatus, errorThrown)

{

$.notify({

message: "Error : "+textStatus

},{

type: 'danger',

delay: 10000,

});

}

});

c_mstuser.js

<?php
session_start();
require_ once ("../model/dbconn.php");
require_ once ("../model/pos.php");
$method=$_POST['method'];
if( isset( $_SERVER['HTTP_X_REQUESTED_WITH'] ) && ( $_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest' ) )
{
	$pos = new pos();
	if($method == 'delete_user'){
		$id_user=strtoupper($_POST['id_user']);
		$pos = new pos();
		$array = $pos->deleteUser($id_user);
		$data['result'] = $array[0];
		$data['error'] = $array[1];
		echo json_encode($data);
	}

	if($method == 'getdata'){
		$pos = new pos();
		$array = $pos->getListUser();
		$data = $array[1];
		$i=0;
		foreach ($data as $key) {

			$data[$i]['button'] = '
			<button type="submit" id_user="'.$key['id_user'].'" class="btn btn-warning btnpass  btn-sm" id="btnpass'.$key['id_user'].'"  ><i class="fa fa-key"></i>
			</button>
			<button type="submit" id_user="'.$key['id_user'].'" username="'.$key['username'].'" h_menu="'.$key['h_menu'].'" class="btn btn-primary btnedit btn-sm " id="btnedit'.$key['id_user'].'"  ><i class="fa fa-edit"></i>
			</button>
			<button type="submit" id_user="'.$key['id_user'].'" class="btn  btn-danger btndelete  btn-sm " id="btndelete'.$key['id_user'].'" ><i class="fa fa-remove"></i>
				</button';


				$i++;
			}
			$datax = array('data' => $data);
			echo json_encode($datax);
		}

		if($method == 'reset_password')
		{
			$id_user= $_POST['id_user'];
			$newpass = $_POST['new_pass'];
			$pos = new pos();
			$array = $pos->resetPass($id_user,$newpass);
			$result['result'] = $array[0];
			$result['error'] = $array[1];

			echo json_encode($result);
		}

		if($method == 'save_user'){
			$id_user=$_POST['id_user'];
			$username=strtoupper($_POST['username']);
			$pass_user=strtoupper($_POST['pass_user']);
			$h_menu=strtoupper($_POST['h_menu']);
			$pos = new pos();
			if($_POST['crud'] == 'N'){
				$array = $pos->saveUser($username,$pass_user,$h_menu);
			}else{
				$array = $pos->updateUser($id_user,$username,$h_menu);
			}
			$result['result'] = $array[0];
			$result['error'] = $array[1];
			$result['crud'] = $_POST['crud'];
			echo json_encode($result);
		}
	} else {
		exit('No direct access allowed.');
	}

<?php

session_start();

require_ once ("../model/dbconn.php");

require_ once ("../model/pos.php");

$method=$_POST['method'];

if( isset( $_SERVER['HTTP_X_REQUESTED_WITH'] ) && ( $_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest' ) )

{

$pos = new pos();

if($method == 'delete_user'){

$id_user=strtoupper($_POST['id_user']);

$pos = new pos();

$array = $pos->deleteUser($id_user);

$data['result'] = $array[0];

$data['error'] = $array[1];

echo json_encode($data);

}

if($method == 'getdata'){

$pos = new pos();

$array = $pos->getListUser();

$data = $array[1];

$i=0;

foreach ($data as $key) {

$data[$i]['button'] = '

</button>

</button>

</button';

$i++;

}

$datax = array('data' => $data);

echo json_encode($datax);

}

if($method == 'reset_password')

{

$id_user= $_POST['id_user'];

$newpass = $_POST['new_pass'];

$pos = new pos();

$array = $pos->resetPass($id_user,$newpass);

$result['result'] = $array[0];

$result['error'] = $array[1];

echo json_encode($result);

}

if($method == 'save_user'){

$id_user=$_POST['id_user'];

$username=strtoupper($_POST['username']);

$pass_user=strtoupper($_POST['pass_user']);

$h_menu=strtoupper($_POST['h_menu']);

$pos = new pos();

if($_POST['crud'] == 'N'){

$array = $pos->saveUser($username,$pass_user,$h_menu);

}else{

$array = $pos->updateUser($id_user,$username,$h_menu);

}

$result['result'] = $array[0];

$result['error'] = $array[1];

$result['crud'] = $_POST['crud'];

echo json_encode($result);

}

} else {

exit('No direct access allowed.');

}

Add the following MySQL query list in the pos.php file:

/*********************query for master user*********************/
  public function getListUser()
  {
    $db = $this->dblocal;
    try
    {
      $stmt = $db->prepare("select * from m_user where username<>'admin' order by username desc");
      $stmt->execute();
      $stat[0] = true;
      $stat[1] = $stmt->fetchAll(PDO::FETCH_ASSOC);
      return $stat;
    }
    catch(PDOException $ex)
    {
      $stat[0] = false;
      $stat[1] = $ex->getMessage();
      return $stat;
    }
  }

  public function saveUser($username,$pass_user,$h_menu)
  {
    $db = $this->dblocal;
    try
    {
      $stmt = $db->prepare("insert into m_user(username,pass_user,h_menu)
        values(:name,MD5(:pass),:hmenu)");

      $stmt->bindParam("name",$username);
      $stmt->bindParam("pass",$pass_user);
      $stmt->bindParam("hmenu",$h_menu);
      $stmt->execute();
      $stat[0] = true;
      $stat[1] = "Sukses save!";
      return $stat;
    }
    catch(PDOException $ex)
    {
      $stat[0] = false;
      $stat[1] = $ex->getMessage();
      return $stat;
    }
  }
  public function updateUser($id_user,$username,$h_menu)
  {
    $db = $this->dblocal;
    try
    {
      $stmt = $db->prepare("update m_user set username = :name, h_menu = :hmenu  where id_user = :id");

      $stmt->bindParam("name",$username);
      $stmt->bindParam("id",$id_user);
      $stmt->bindParam("hmenu",$h_menu);
      $stmt->execute();
      $stat[0] = true;
      $stat[1] = "Sukses update!";
      return $stat;
    }
    catch(PDOException $ex)
    {
      $stat[0] = false;
      $stat[1] = $ex->getMessage();
      return $stat;
    }
  }
  public function deleteUser($id_user)
  {
    $db = $this->dblocal;
    try
    {
      $stmt = $db->prepare("delete from m_user  where id_user = :id");

      $stmt->bindParam("id",$id_user);
      $stmt->execute();
      $stat[0] = true;
      $stat[1] = "Sukses update!";
      return $stat;
    }
    catch(PDOException $ex)
    {
      $stat[0] = false;
      $stat[1] = $ex->getMessage();
      return $stat;
    }
  }

  public function checkPassword($id,$pass)
  {
    $db = $this->dblocal;
    try
    {
      $stmt = $db->prepare("select * from m_user where id_user = :id and pass_user = md5(:pass)");

      $stmt->bindParam("id",$id);
      $stmt->bindParam("pass",$pass);

      $stmt->execute();
      $stat[0] = true;
      $stat[1] = $stmt->rowCount();
      return $stat;
    }
    catch(PDOException $ex)
    {
      $stat[0] = false;
      $stat[1] = $ex->getMessage();
      return $stat;
    }
  }

  public function resetPass($iduser,$pass)
  {
    $db = $this->dblocal;
    try
    {
      $stmt = $db->prepare("update m_user set pass_user = md5(:pass) where id_user=:id");

      $stmt->bindParam("id",$iduser);
      $stmt->bindParam("pass",$pass);
      $stmt->execute();
      $stat[0] = true;
      $stat[1] = "Sukses reset pass!";
      return $stat;
    }
    catch(PDOException $ex)
    {
      $stat[0] = false;
      $stat[1] = $ex->getMessage();
      return $stat;
    }
  }

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

/*********************query for master user*********************/

public function getListUser()

{

$db = $this->dblocal;

try

{

$stmt = $db->prepare("select * from m_user where username<>'admin' order by username desc");

$stmt->execute();

$stat[0] = true;

$stat[1] = $stmt->fetchAll(PDO::FETCH_ASSOC);

return $stat;

}

catch(PDOException $ex)

{

$stat[0] = false;

$stat[1] = $ex->getMessage();

return $stat;

}

public function saveUser($username,$pass_user,$h_menu)

{

$db = $this->dblocal;

try

{

$stmt = $db->prepare("insert into m_user(username,pass_user,h_menu)

values(:name,MD5(:pass),:hmenu)");

$stmt->bindParam("name",$username);

$stmt->bindParam("pass",$pass_user);

$stmt->bindParam("hmenu",$h_menu);

$stmt->execute();

$stat[0] = true;

$stat[1] = "Sukses save!";

return $stat;

}

catch(PDOException $ex)

{

$stat[0] = false;

$stat[1] = $ex->getMessage();

return $stat;

}

public function updateUser($id_user,$username,$h_menu)

{

$db = $this->dblocal;

try

{

$stmt = $db->prepare("update m_user set username = :name, h_menu = :hmenu where id_user = :id");

$stmt->bindParam("name",$username);

$stmt->bindParam("id",$id_user);

$stmt->bindParam("hmenu",$h_menu);

$stmt->execute();

$stat[0] = true;

$stat[1] = "Sukses update!";

return $stat;

}

catch(PDOException $ex)

{

$stat[0] = false;

$stat[1] = $ex->getMessage();

return $stat;

}

public function deleteUser($id_user)

{

$db = $this->dblocal;

try

{

$stmt = $db->prepare("delete from m_user where id_user = :id");

$stmt->bindParam("id",$id_user);

$stmt->execute();

$stat[0] = true;

$stat[1] = "Sukses update!";

return $stat;

}

catch(PDOException $ex)

{

$stat[0] = false;

$stat[1] = $ex->getMessage();

return $stat;

}

public function checkPassword($id,$pass)

{

$db = $this->dblocal;

try

{

$stmt = $db->prepare("select * from m_user where id_user = :id and pass_user = md5(:pass)");

$stmt->bindParam("id",$id);

$stmt->bindParam("pass",$pass);

$stmt->execute();

$stat[0] = true;

$stat[1] = $stmt->rowCount();

return $stat;

}

catch(PDOException $ex)

{

$stat[0] = false;

$stat[1] = $ex->getMessage();

return $stat;

}

public function resetPass($iduser,$pass)

{

$db = $this->dblocal;

try

{

$stmt = $db->prepare("update m_user set pass_user = md5(:pass) where id_user=:id");

$stmt->bindParam("id",$iduser);

$stmt->bindParam("pass",$pass);

$stmt->execute();

$stat[0] = true;

$stat[1] = "Sukses reset pass!";

return $stat;

}

catch(PDOException $ex)

{

$stat[0] = false;

$stat[1] = $ex->getMessage();

return $stat;

}

Please save all of these files and try it on your browser.

http://localhost/pos/application/utility/v_mstuser.php ,

If successful the display will be as shown below

Little Explanation:

Our focus on this tutorial is how do we add user access to menu. To display a list of menus contained in the database using the following script

<?php
            $pos = new pos();
            $mymenu = $pos->getMenu();
            $num=1;
            $menuku='';
            foreach ($mymenu[1] as $key) {
              if($num==1)
              {
                $menuku .= '<div class="row" >';
                $menuku .= '<div class="col-xs-6" style="padding-left:0px"><h4>'.$key['name_menu'].'</h4>';
                $submenuk = $pos->getSubMenu($key['id_menu']);
                $menuku .= '<ul class="list-group">'; 
                foreach ($submenuk[1] as $keys) {
                  $menuku .= '<li class="list-group-item">
                  <input type="checkbox"  id="check-'.$keys["id_sub_menu"].'" class="chkbox" value="'.$keys['id_sub_menu'].'" > <strong>'.$keys['name_sub_menu'].'</strong>
                  </li>'; 
                }
                $menuku .= '</ul>'; 
                $menuku .= '</div>';
              }else{
                $menuku .= '<div class="col-xs-6" style="padding-left:0px"><h4>'.$key['name_menu'].'</h4>';
                $submenuk = $pos->getSubMenu($key['id_menu']);
                $menuku .= '<ul class="list-group">'; 
                foreach ($submenuk[1] as $keys) {
                  $menuku .= '<li class="list-group-item"><input type="checkbox" id="check-'.$keys["id_sub_menu"].'" class="chkbox" value="'.$keys['id_sub_menu'].'" > <strong>'.$keys['name_sub_menu'].'</strong></li>'; 
                }
                $menuku .= '</ul>';
                $menuku .= '</div>';
                $menuku .= '</div>';
                $num=0;
              }
              $num++;
            }
            ?>

<?php

$pos = new pos();

$mymenu = $pos->getMenu();

$num=1;

$menuku='';

foreach ($mymenu[1] as $key) {

if($num==1)

{

$menuku .= '<div class="row" >';

$menuku .= '<div class="col-xs-6" style="padding-left:0px"><h4>'.$key['name_menu'].'</h4>';

$submenuk = $pos->getSubMenu($key['id_menu']);

$menuku .= '<ul class="list-group">';

foreach ($submenuk[1] as $keys) {

$menuku .= '<li class="list-group-item">

</li>';

}

$menuku .= '</ul>';

$menuku .= '</div>';

}else{

$menuku .= '<div class="col-xs-6" style="padding-left:0px"><h4>'.$key['name_menu'].'</h4>';

$submenuk = $pos->getSubMenu($key['id_menu']);

$menuku .= '<ul class="list-group">';

foreach ($submenuk[1] as $keys) {

$menuku .= '<li class="list-group-item"><input type="checkbox" id="check-'.$keys["id_sub_menu"].'" class="chkbox" value="'.$keys['id_sub_menu'].'" > <strong>'.$keys['name_sub_menu'].'</strong></li>';

}

$menuku .= '</ul>';

$menuku .= '</div>';

$num=0;

}

$num++;

}

From the code above we can show the layout like image below:

You can add some parameters you need to the user module. Up here how to create the master user page module on point of sale PHP has been completed, my next article will discuss how to create a page to add new items/product.

Once again this is a tutorial for beginners, if you are already expert please provide feedback for this article, for those who still do not understand please ask through the comment form below