How to send button value to ajax

Question

I try to send button values (integers) as page numbers to ajax function then to a php file, but can not get it work. Buttons are:

<form method="get" onchange = PageFunction(this.value)>
<button class = 'pages' type='button' onchange = 'PageFunction(this.value)' value="1">1</button>
<button class = 'pages' type='button' onchange = 'PageFunction(this.value)' value="2">2</button>
</form>

Ajax function is:

function PageFunction(page){
var ajaxRequest; 

if (page==""){
    document.getElementById("Pagination").innerHTML = "";
    return;
}else{

    if (window.XMLHttpRequest) {
    ajaxequest = new XMLHttpRequest();
    }else{
    ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
}

// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
    if(ajaxRequest.readyState == 4 && ajaxequest.status == 200){

        var ajaxDisplay = document.getElementById('Pagination');
        ajaxDisplay.innerHTML = ajaxRequest.responseText;
    }
}

ajaxRequest.open("GET", "pathjobs-ajax2.php" + page, true);
ajaxRequest.send(null); 
}

Thanks for your help!

if you use jquery, you can use something like this var x = $('.mybutton').attr('value'); -- js has this: getAttribute("value"); — Burning Crystals
– Burning Crystals, Commented Jul 20, 2015 at 4:48

Kevin Simple · Accepted Answer · 2015-07-20 04:49:26Z

1

mate, the button does not have onchange, try this :

<button class = 'pages' type='button' onclick = 'PageFunction(this.value)' value="2">2</button>

answered Jul 20, 2015 at 4:49

Kevin Simple

1,21312 silver badges22 bronze badges

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

1 Comment

LearnAWK Over a year ago

I changed them to "onclick" and got no luck.

atinder · Accepted Answer · 2015-07-20 05:26:00Z

0

Without using jQuery

var PageFunction = function(val) {
  console.log(val);
  // ajax call here.
}

<form method="get" onchange = PageFunction(this.value)>
  <button class = 'pages' type='button' onclick = 'PageFunction(this.value)' value="1">1</button>
  <button class = 'pages' type='button' onclick = 'PageFunction(this.value)' value="2">2</button>
</form>

Using jQuery

$('.pages').on('click',function(e){
  console.log($(this).val());
  // ajax call here.
});

edited Jul 20, 2015 at 5:26

answered Jul 20, 2015 at 4:51

atinder

2,09014 silver badges15 bronze badges

4 Comments

LearnAWK Over a year ago

If I use non-jQuery option, should I put ajax codes before the ending '}'? Sorry for the naive question, I have zero experience with jQuery.

LearnAWK Over a year ago

For the jQuery option, does the following code make sense or not? $('.pages').on('click',function(e){ console.log($(this).val()); var ajaxRequest; if (val==""){ document.getElementById("Pagination").innerHTML = ""; return; }else{ if (window.XMLHttpRequest) { ajaxequest = new XMLHttpRequest(); }else{ ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP"); } } ajaxRequest.onreadystatechange = function(){ if(ajaxRequest.readyState == 4 && ajaxequest.status == 200){ //codes too long, partially deleted });

atinder Over a year ago

i would urge you to read basics of javaScript first, will help you a lot developer.mozilla.org/en-US/Learn/Getting_started_with_the_web/…

LearnAWK Over a year ago

I think so too. Thanks a lot!

Collectives™ on Stack Overflow

How to send button value to ajax

2 Answers 2

1 Comment

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related