How to delete an Identity user by Ajax Modal with confirmation message? RSS

• • Reply
  musbah7@hotm...

  Member

  62 Points

  180 Posts

  How to delete an Identity user by Ajax Modal with confirmation message?

  Feb 17, 2021 10:05 AM|musbah7@hotmail.com|LINK

  Hi

  I have this ApplicationUser model:

      public class ApplicationUser : IdentityUser
      {
          public string FullName { get; set; }
  
          public string MobileNo { get; set; }
  
          public ICollection<ApplicationUserRole> UserRoles { get; set; }
      }

  I want to delete a record by Ajax Modal with confirmation message.

  I have this method in DeleteController:

          private readonly ApplicationDbContext _context;
  
          public DeleteController(ApplicationDbContext context)
          {
              _context = context;
          }
          [HttpPost]
          public ActionResult Users(string Id)
          {
              var drec = _context.ApplicationUser.Where(x => x.Id == Id).FirstOrDefault();
              _context.ApplicationUser.Remove(drec);
              _context.SaveChanges();
              return Json(true);
          }

  And trying this code in view:

  @*Some Code*@
              <tr id="row_@item.Id">
                  <td>
                      <a class="btn" onclick="ConfirmDelete(@item.Id)">
                          <img src="~/images/n-delete.png" height="30" width="30" />
                      </a>
                  </td>
  @*Some Code*@
  <div class="modal fade" id="myModal">
      <div class="modal-dialog">
          <div class="modal-content">
              <div class="modal-header">
                  <h3 class="modal-title">Delete</h3>
              </div>
              <div class="modal-body">
                  <h4> Are you sure?</h4>
              </div>
              <div class="modal-footer">
                  <a href="#" class="btn btn-default" data-dismiss="modal">Cancel</a>
                  <a href="#" class="btn btn-primary" onclick="DeleteRec()">OK</a>
              </div>
          </div>
      </div>
  </div>
  
  <input type="hidden" id="hiddenRecId" />
  
  <script>
      var ConfirmDelete = function (RecId) {
          $("#hiddenRecId").val(RecId);
          $("#myModal").modal('show');
      }
  
      var DeleteRec = function () {
          var vId = $("#hiddenRecId").val();
          $.ajax({
              type: "POST",
              url: "/Delete/Users",
              data: { Id: vId },
              success: function (result) {
                  $("#myModal").modal("hide");
                  $("#row_" + vId).remove();
              }
          })
      }
  </script>

  But when I press the Delete icon no modal appears. Why? and how to solve please?

  Note: I've overridden the Identity by adding scaffolding item.

• • Reply
  mgebhard

  All-Star

  53041 Points

  23612 Posts

  Re: How to delete an Identity user by Ajax Modal with confirmation message?

  Feb 17, 2021 12:11 PM|mgebhard|LINK

  I created a sample based on your code and the modal opens as expected.  There must be problems elsewhere in your code or design.  I recommend opening the browser's Dev Tools (F12) and doing basic troubleshooting.  

  @{
      ViewData["Title"] = "Index";
  }
  
  <h1>Index</h1>
  
  <a class="btn" onclick="ConfirmDelete(1)">
      Modal
  </a>
  
  <div class="modal fade" id="myModal">
      <div class="modal-dialog">
          <div class="modal-content">
              <div class="modal-header">
                  <h3 class="modal-title">Delete</h3>
              </div>
              <div class="modal-body">
                  <h4> Are you sure?</h4>
              </div>
              <div class="modal-footer">
                  <a href="#" class="btn btn-default" data-dismiss="modal">Cancel</a>
                  <a href="#" class="btn btn-primary" onclick="DeleteRec()">OK</a>
              </div>
          </div>
      </div>
  </div>
  <input type="hidden" id="hiddenRecId" />
  
  @section scripts{
      <script>
          var ConfirmDelete = function (RecId) {
              $("#hiddenRecId").val(RecId);
              $("#myModal").modal('show');
          }
  
          var DeleteRec = function () {
              var vId = $("#hiddenRecId").val();
              $.ajax({
                  type: "POST",
                  url: "/Bootstrap/Index",
                  data: { Id: vId },
                  success: function (result) {
                      $("#myModal").modal("hide");
                      //$("#row_" + vId).remove();
                      console.log(result);
                  }
              })
          }
      </script>
  
  }
  

• • Reply
  l.laxmikant

  Contributor

  3540 Points

  921 Posts

  Re: How to delete an Identity user by Ajax Modal with confirmation message?

  Feb 19, 2021 03:45 PM|l.laxmikant|LINK

  Add div with name dialog-confirm

  <div id="dialog-confirm" title="Empty the recycle bin?">
    <p><span class="ui-icon ui-icon-alert" style="float:left; margin:12px 12px 20px 0;"></span>These items will be permanently deleted and cannot be recovered. Are you sure?</p>
  </div>

  Show dialog box to delete user on click of each image having css as btn

   $( ".btn" ).dialog({
        resizable: false,
        height: "auto",
        width: 400,
        modal: true,
        buttons: {
          "Delete all items": function() {
  
  	 var vId = $("#hiddenRecId").val();
   		$.ajax({
      			type: "POST",
      			url: "/Delete/Users",
       			data: { Id: vId },
       			success: function (result) {
                  	$("#myModal").modal("hide");
                  	$("#row_" + vId).remove();
              	}
   	   })	
            $( this ).dialog( "close" );
          },
          Cancel: function() {
            $( this ).dialog( "close" );
          }
        }
   });

  GeeksArray.com
  
• • Reply
  bruce (sqlwo...

  All-Star

  58194 Points

  15655 Posts

  Re: How to delete an Identity user by Ajax Modal with confirmation message?

  Feb 19, 2021 04:13 PM|bruce (sqlwork.com)|LINK

  In the line

  <a class="btn" onclick="ConfirmDelete(@item.Id)">

  many browser will not fire the click event if the href is not defined. Be sure to cancel the navigation. You can use a bookmark href=“#”

  bruce (sqlwork.com)