0

I have a delete link for every row in my grid. It looks like this:

<a href="deleteLink" onclick="return OnDeleteRecord(122885);"><font color="#CC0000">Delete</font></a>

My objective is to check if a record has been printed or not by making an Ajax call to an ASP.net Web Method two times. Once before the user confirms delete, and once again after they click confirm.

I easily took care of this by creating a synchronous AJAX call, but I read everywhere that synchronous AJAX calls are horrible and depricated.

After looking here I decided to use JQuery deferred objects to grab the response values

What I did was this:

  1. After clicking "Delete" OnDeleteRecordClick(recordID) gets called.

  2. First, I make my Ajax Call, then return false (notice the end of the method)

  3. Then, after I get the first response, depending on if the record is not printed or not, I show a javascript confirmation, and make my ajax call again, Then return false again.

  4. After the second response, if the record is unprinted, I return true, to delete the record.

Here's my OnDeleteRecord:

function OnDeleteRecordClick(recordID) {
  // This action takes place asynchronously
  BeforeRecordDelete (recordID)
    .done(function (r) {
      if (r.d == 1) {
        // Check isPrinted before clicking "Confirm"
        alert("You can't delete this record printed.");
        return false;
      } else {
        if (ConfirmDelete('record')) {
          // Check isPrinted again after clicking "Confirm"
          BeforeRecordDelete (recordID)
            .done(function (r) {
            if (r.d == 1) {
              alert("You can't delete this record because it has been printed.");  
              return false;
            } else {
              // Proceed to delete
              return true;
            }
          })
          .fail(function (x) {
            Alert("server failed");
            return false
          });

          // Return false until we get a response from the server
          return false;
          } else {
            // User clicks "Cancel"
            return true;
          }
        }
      })
    .fail(function (x) {
      // Tell the user something bad happened
      Alert("server failed");
      return false;
    });

  // Return false until we get a response from the server
  return false;
}

Here's my async AJAX call:

BeforeRecordDelete = function (recordID) {
  return $.ajax({
    type: "POST",
    url: "RecordList.aspx/IsRecordPrinted",
    contentType: "application/json; charset=utf-8",
    data: '{RecordID: "' + RecordID + '"}',
    dataType: "json"
  });
}

Here's my problem: When I return false two times, then return true, the hyperlink wouldn't work.

My questions are:

  1. Can I even do this to a hyperlink? (Returning multiple values to OnClick)

  2. Is there a better way to do this? I really want to do this asynchronously, but my brain hurts.

Community
  • 1
  • 1
Vin Shahrdar
  • 1,151
  • 1
  • 12
  • 30
  • It really looks like you should be doing more of this on the back end. If the record can't be deleted because its been printed, why are you displaying the delete link in the first place? For the delete call, why not do the confirm first, then send the send the AJAX request to delete? Let the server return a success/fail message at that point. – Adam Konieska Jun 15 '16 at 21:08
  • @AdamKonieska The grid displays a different link instead of the delete when a record is deleted. This case happens in the following scenario: 1. We load the page 2. Another user prints the record 3. Page is not refreshed In other words, I'm trying to avoid the postback here. edit: grammer – Vin Shahrdar Jun 15 '16 at 21:11
  • Exactly, you're checking it twice and you don't need to be. Do the JS confirm, then send the delete request to the server and have the backend handle it once. If it cant be deleted return the fail message from the backend, if it can be deleted have the backend return the success message. – Adam Konieska Jun 15 '16 at 23:03
  • @AdamKonieska Okay, that is just a minor refactoring, but how can I do it asynchronously? My problem is that as soon as I return my "dummy" false value, whatever value I return again after i get a response from the server will not affect the hyperlink. – Vin Shahrdar Jun 16 '16 at 13:27
  • You're getting wrapped up with too many return statements. Do the confirm, then the ajax request, and have the server return true if it deleted the record or false if it couldn't. Something like this would work: http://jsfiddle.net/igor_9000/oumx8jy1/ – Adam Konieska Jun 16 '16 at 15:04

0 Answers0