How to change button value?

Question

<input onclick="getInvitevalue(__id__, this)" type="button" value="Invite" name="InviteTeacher" class="InviteTeacher" id= "InviteTeacher"/>

<input onclick="getCancelvalue(__id__, InviteTeacher)" type="button" value="Cancel" name="Cancel" class="Cancel" id= "Cancel"/>function getInvitevalue(idValue,invite){var field1 = idValue;
$.ajax({  url: "inviteteacher.php",  type: "POST",  data: ({name: field1}),}).done(function() {
if(invite.value = 'Invite')
invite.value = 'Pending Request';});}function getCancelvalue(idValue,cancel){var field2 = idValue;
$.ajax({  url: "inviteteacher.php",  type: "POST",  data: ({name: field2}),}).done(function() { 
if(cancel.value = 'Pending Request')
cancel.value = 'Invite';});}

Here onclick id which is used to display dynamic values.Refer my code and say how I change it in boonex-Dolphin??

Sure, what you try so far?.. can you post your code to a fiddle to play with? — gmo, Aug 14 '13 at 09:47
Try this $(".invite").click(function(){ $(".invite").val("Pending Request"); }); $(".cancel").click(function(){ $(".invite").val("Invite"); }); — Eswara Reddy, Aug 14 '13 at 09:54
@EswaraReddy That is not a comment, please don't answer questions with a comment. — iConnor, Aug 14 '13 at 10:03
@EswaraReddy cool, if you would have put that code in a answer, you could have got some points. — iConnor, Aug 14 '13 at 11:16
I am not able to answer this question. Here the answer text area is not displaying. — Eswara Reddy, Aug 14 '13 at 11:17
@ManiamuthaKrish Late reply, but you would click the `edit` button under your question. — iConnor, Aug 21 '13 at 02:22

Tushar Gupta - curioustushar · Accepted Answer · 2013-08-14T14:08:55.867

0

Shorter code--> no need of wrapping butoons in div

new shorter DEMO

$('.b2').attr('disabled', true);
$('.b1').click(function () {
    this.value = 'Pending Request';
    $(this).next('.b2').removeAttr('disabled');
});
$('.b2').click(function () {
    $(this).attr('disabled', true).prev('.b1').val('Invite');
});

Now using class for the button and buttons are wrapped in div

Updated Demo

HTML

<div>
    <input type="button" class="b1" value="Invite" />
    <input type="button" class="b2" value="Cancel" />
</div>

$('.b2').attr('disabled', true);
$('.b1').click(function () {
    this.value = 'Pending Request';
    $(this).parents('div').find('.b2').removeAttr('disabled');
});
$('.b2').click(function () {
    $(this).attr('disabled', true).parents('div').find('.b1').val('Invite');
});

$('#b1') refers to the element with id b1

this.value = 'Pending Request' change the text of the current element clicked in below code change value of element with id b1

DEMO

HTML

<input type="button" id="b1" value="Invite" />
<input type="button" id="b2" value="Cancel" />

js

$('#b1').click(function () {
    this.value = 'Pending Request';
});
$('#b2').click(function () {
    $('#b1').val('Invite');
});

edited Aug 14 '13 at 14:08

answered Aug 14 '13 at 09:51

Tushar Gupta - curioustushar

58,085
24
103
107

Its work fine only for first member. What about next next?? – Maniamutha Krish Aug 14 '13 at 10:35
Waiting for your reply.. – Maniamutha Krish Aug 14 '13 at 12:27
@ManiamuthaKrish what do you mean working for first member only ?? – Tushar Gupta - curioustushar Aug 14 '13 at 12:28
I have listed the members. The Invite,cancel buttons are display in each member like Facebook. – Maniamutha Krish Aug 14 '13 at 12:30
See my codings.The id are fetch from Database.The Invite button is working fine for all members because of using 'this'. But the cancel button not working for all members. – Maniamutha Krish Aug 14 '13 at 12:34
@ManiamuthaKrish check updated demo http://jsfiddle.net/cse_tushar/ECyKR/1/ – Tushar Gupta - curioustushar Aug 14 '13 at 12:37
Thanks.I expect this one.. – Maniamutha Krish Aug 14 '13 at 13:08

score 0 · Answer 2 · answered Aug 14 '13 at 09:53

Here's a jsFiddle demo, I have also set the cancel button to disabled when no request is running and so on.

HTML:

<button id="btn_start_request">Invite</button>
<button id="btn_cancel_request">Cancel</button>

JS:

function startRequest() {
    $("#btn_start_request").text("Pending request ..").attr("disabled", true)
    $("#btn_cancel_request").attr("disabled", false)

    // start request here
}
function cancelRequest() {
    $("#btn_start_request").text("Invite").attr("disabled", false)
    $("#btn_cancel_request").bind("click", cancelRequest).attr("disabled", true)

    // cancel request here
}

$(function() {
    $("#btn_start_request").bind("click", startRequest)
    $("#btn_cancel_request").bind("click", cancelRequest).attr("disabled", true)
})

How to change button value?

2 Answers2