jQuery:modal-dialog with if else

Question

dear all, i need to combine two different result in one script. The problem is like this:

if #edit clicked -> show dialog -> click button #ok inside dialog, then do function:

if($('#user').val() !== "admin" || $('#password').val() !== "qaubuntu") {
                  alert('Invalid login');
                  return false;
                  } else {
                            $('#dialog').dialog('close');
                            $('#tabs').show();
                            $('#editdata').show();
                            return false;
                            }

if #del clicked -> show dialog -> click button #ok inside dialog, then do function:

if($('#user').val() !== "admin" || $('#password').val() !== "qaubuntu") {
                      alert('Invalid login');
                      return false;
                      } else {
                                $('#dialog').dialog('close');
                                $('#tabs').show();
                                $('#deletedata').show();
                                return false;
                                }

can you show me how do i do that?

Answer 1

I would probably bind the click event to a class or type selector rather than an id and use a class to differentiate between the elements clicked.

e.g

if($(this).hasClass("edit")){
    $('#editdata').show();
    return false;
}else{
    $('#deletedata').show();
    return false;
}

You could also move the deletedata/edit data show functions into a separate function with a parameter that flags which one to show.

e.g

function showDialogue(isEdit){
    if(isEdit === true){
            $('#editdata').show();
            return false;
    }else{
            $('#deletedata').show();
            return false;
    }
};

Answer 2

Use a class to the links ex- "openDialog"

 var flag="";
 $(".openDialog").click(function () { 
 flag=$(this).attr('id');
 //now call show dialog here.....
 });

inside the OK button check for the flag

if($('#user').val() !== "admin" || $('#password').val() !== "qaubuntu") {
              alert('Invalid login');
              return false;
              } else {
                        $('#dialog').dialog('close');
                        $('#tabs').show();
                        //------------------
                          if(flag=='edit')
                             $('#editdata').show();
                          else if(flag=='del')
                             $('#editdata').show();
                        //-------------------
                        return false;
                        }