shibbir ahmed
shibbir ahmed

Reputation: 1024

jQuery dblclick() issue?

I have 2 input fields which is

a) email and
b) private_email

and I want to show alert message 1 when user double click on email field and 2 when user double click on private_email field. So that I am using following jQuery code but its showing only 1 in alert message :

jQuery Code :

$(document).ready(function(){
  $("input#email, input#email_private").dblclick(function(){  
    var email = $("input#email").val();
    var private_email = $("input#email_private").val();
    var cdid =  $("#cdid_hidden").val();    
    var cid=$('#cdid_hidden').val();

    if(email) {
        alert(1);
        window.open('mailto:<?php echo $res['email']; ?>?subject=', '_self');   
    } else {
        window.open('mailto:<?php echo $res['email_private']; ?>?subject=', '_self');   
        alert(2);

    }       

    var url = "response.php?confirmEmail=confirm&cdid="+cdid;   
    $.get(url); 
    getDetails(cid);    

  });
});

Upvotes: 1

Views: 82

Answers (4)

Bram Vanroy
Bram Vanroy

Reputation: 28505

Just check if the element that is clicked is() one or the other, and execute accordingly.

$(document).ready(function(){
  $("input#email, input#email_private").dblclick(function(){  
    var email = $("input#email");
    var emailVal = email.val();
    var private_email = $("input#email_private").val();
    var cdid =  $("#cdid_hidden").val();    
    var cid=$('#cdid_hidden').val();

    if($(this).is(email)) {
        alert(1);
        window.open('mailto:<?php echo $res['emailVal']; ?>?subject=', '_self');   
    } else {
        window.open('mailto:<?php echo $res['email_private']; ?>?subject=', '_self');   
        alert(2);

    }       

    var url = "response.php?confirmEmail=confirm&cdid="+cdid;   
    $.get(url); 
    getDetails(cid);    

  });
});

Upvotes: 1

Dennis Wanyonyi
Dennis Wanyonyi

Reputation: 378

You can instead just check which element fired the event by getting the ID of the element. Then in the if statement you can check the element ID and return the appropriate action. Here is a snippet how to accomplish that

HTML CODE

<div>
    <input type="text" placeholder="Email here" id="email" />
</div>
<div>
    <input type="text" placeholder="Email Private here" id="email_private" />
 </div>

JQUERY CODE

$(document).ready(function () {
$('input#email, input#email_private').dblclick(function (event) {
    alert("Double clicked");

    if (event.target.id === 'email') {
        alert("Email double clicked");
        // Email textbox triggered the event
        // Do something
    }
    else if (event.target.id == 'email_private') {
        alert("Email Private double clicked");
        // Email private triggeredd this event, do something here
    }
   });
 });

Here is a jsfiddle for it

Upvotes: 0

StaticBeagle
StaticBeagle

Reputation: 5175

IMHO It would be easier to have two dblclick handlers. That being said, in your code even though you are listening to the dblclick event of both inputs you are only checking whether or not the email input is empty

if(email) {
    alert(1);
    window.open('mailto:<?php echo $res['email']; ?>?subject=', '_self');   
} else {
    window.open('mailto:<?php echo $res['email_private']; ?>?subject=', '_self');   
    alert(2);

}   

If you don't want to have separate event handlers you could try checking for the id something like

$(document).ready(function(){
  $("input#email, input#email_private").dblclick(function(){  
    var email = $("input#email").val();
    var private_email = $("input#email_private").val();
    var cdid =  $("#cdid_hidden").val();    
    var cid=$('#cdid_hidden').val();
    var clicked = $(this).attr('id');
    if(clicked == 'email') {
        alert(1);
        window.open('mailto:<?php echo $res['email']; ?>?subject=', '_self');   
    } else {
        window.open('mailto:<?php echo $res['email_private']; ?>?subject=', '_self');   
        alert(2);

    }       

    var url = "response.php?confirmEmail=confirm&cdid="+cdid;   
    $.get(url); 
    getDetails(cid);    

  });
});

Upvotes: 0

Lokesh_Ram
Lokesh_Ram

Reputation: 391

I guess you want to show alert 1 and 2 based on the related input double click.. I have modified your code to achieve that..

Jquery:

  $(document).ready(function(){
  $("input#email, input#email_private").dblclick(function(){  

  var private_email = $("input#email_private").val();
  var cdid =  $("#cdid_hidden").val();    
  var cid=$('#cdid_hidden').val();

    if($(this).attr('id') == 'email') {
    alert(1);
    window.open('mailto:<?php echo $res['email']; ?>?subject=', '_self');   
    } else {
    window.open('mailto:<?php echo $res['email_private']; ?>?subject=',   '_self');   
    alert(2);
    }       

 var url = "response.php?confirmEmail=confirm&cdid="+cdid;   
 $.get(url); 
 getDetails(cid);    
 });
 });

Upvotes: 0

Related Questions