CODEWITHSUNDEEP
javascriptjqueryhtml
shibbir ahmed
shibbir ahmed

Reputation: 1024

How can I show alert message if input box content is changed and button is not pressed?

I have a textarea box to show notes from db. This box data is saved using following submit button : 

<button class="submit" id="save_note" value="save_note" onclick="edit_notebox(this,event);"><b>Save Note</b></button>

Now I am trying to show alert message if all following condition is fill up :

  1. when user click outside of box
  2. if existing content is changed
  3. if button is not pressed

if above 3 conditions is true or fulfill then I want to show alert message.

So, for that I am using following code but not working:

Js Code :

var is_clicked =  $("#save_note").val();
var previousValue = $("#project_notes").val();
$("#project_notes").blur(function(e) {

    var currentValue = $(this).val();
    if( currentValue != previousValue && is_clicked != 'save_note' ) {
         previousValue = currentValue;
         alert("Value changed!");
    }
});

How can I get alert message based on above 3 condition ?

Upvotes: 0

Views: 98

Answers (1)

Derek Story
Derek Story

Reputation: 9593

You could do something along these lines using a boolean variable:

Codepen

var is_clicked = false; 
var previousValue = $("#project_notes").val();

// Use mousedown instead of click so that it fires before the blur
$('.submit').on('mousedown', function(){
  is_clicked = true; // Click happened
});

$("#project_notes").blur(function(e) {
  var currentValue = $(this).val();
  if (currentValue != previousValue && !is_clicked) {
    previousValue = currentValue;
    alert("Value changed!");
  }
  is_clicked = false; // Reset to catch next button click

});

Upvotes: 1

Related Questions