Call JavaScript/AJAX with a button without onClick function by his input name. Is it possible?

Question

Got the next html code:

<form name="frm">
   <textarea class="textarea" name="textarea" id="textarea">
     <?php
        foreach ($textarea as $textareashow){
          echo $textareashow."\r\n";
        }?>
   </textarea><br><br>
   <input type="button" name="callbutton" value="Push button" id="execbutton" />
</form>

And the next JavaScript code:

$(document).ready(function () {
  $('#callbutton').click(function () {
     alert("HELLO!!!");
  });
});

What I want is to call the JavaScript function from his button input name. Is it possible? and from his input id? Thank you very much.

Code Lღver · Accepted Answer · 2015-04-17 09:01:03Z

5

Try this:

$(document).ready(function () {
    $('#execbutton').click(function () {
       alert("HELLO!!!");
   });
});

Will work.

Explanation: # is used to select the element by id and . is used to select an element by classname. you are selecting element by name so you need to use the $("input[name=callbutton]"). If you are selecting any element by its property or attribute then you need to use it in [] brackets. [property_name=property_name_value] like this.

edited Apr 17, 2015 at 9:01

answered Apr 17, 2015 at 8:55

Code Lღver

15.6k16 gold badges61 silver badges75 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user3321425 Over a year ago

Thank you very much to all of you guys! After a while I realized that the call link to js/jquery was below the call link to my js/textareascript.js!!!!!!! that's why the script was not working. What a cock-up!

Code Lღver Over a year ago

@user3321425 nice to hear from you and your hard work. My pleasure to help you. :)

Cosmin · Accepted Answer · 2015-04-17 09:10:22Z

5

Of course it's possible. I've posted a jsfiddle below

You can use following jQuery selectors : #id and input[name=something] ( you don't need to use both of them )

To add a click event on a button ( in your case ) you can use .click(function(){})

So :

$(function(){
     $("#your_btn_id").click(function(){   // using selector by id
          // do something
     });

     $('input[name="your_btn_name"]').click(function(){  // using selector by name
         // do something
     });   
})

You can also combine selectors :

$(function(){
     $('#your_btn_id, input[name="your_btn_name"]').click(function(){   
          // do something
     });


     // or


    $("#your_btn_id").add('input[name="your_btn_name"]').click(function(){   
          // do something
     });
})

Fiddle

edited Apr 17, 2015 at 9:10

answered Apr 17, 2015 at 8:55

Cosmin

2,2141 gold badge23 silver badges39 bronze badges

1 Comment

iCollect.it Ltd Over a year ago

Code and explanation in the answer is always better (JSFiddle to back up that it works) :)

Shiladitya · Accepted Answer · 2017-10-12 12:39:57Z

5

by input name use input[name="callbutton"] by id use the id notation #

$(document).ready(function () {
  $('input[name="callbutton"],#textarea').click(function () {
    alert("HELLO!!!");    
  });
});

edited Oct 12, 2017 at 12:39

Shiladitya

12.2k17 gold badges29 silver badges43 bronze badges

answered Apr 17, 2015 at 8:58

madalinivascu

32.4k4 gold badges41 silver badges59 bronze badges

Collectives™ on Stack Overflow

Call JavaScript/AJAX with a button without onClick function by his input name. Is it possible?

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related