how to change a button text in jQuery mobile

Question

Possible Duplicate:
change text on button using jquery mobile.

I need to change a button text, I am using jQuery mobile.

Here is my html:

<fieldset>
    <div><button type="submit" id="login_var">Login</button></div>
    <div><button type="reset" >Reset</button></div>
</fieldset>

I have tried all of the examples on this page: LINK and nothing is working for me.

Please help

I want to replace `Login` text with whatever text..something like `OK` Just to see how does it works. Don't worry about the event it is not important right now. I just need to access that text in the button and change it — user123_456, Aug 23 '12 at 11:40
in my case it is working as I use to change my text in place of Login write OK... — Arpit Srivastava, Aug 23 '12 at 11:46
@denonth actually I use it many application so I copy from one application — Arpit Srivastava, Aug 23 '12 at 11:56
@denonth-Have you clear all history and cookie may be problem with that only? — Arpit Srivastava, Aug 23 '12 at 11:57
I don't know if you understand me correctly. I need to change the text of the button dynamically in another words I need to access a button variable and change the text — user123_456, Aug 23 '12 at 11:58
@ArpitSrivastava what you have sent is a example of how to create a button — user123_456, Aug 23 '12 at 11:58
@ArpitSrivastava I need to access the variable from the javascript and change its value — user123_456, Aug 23 '12 at 12:04

score 6 · Answer 1 · answered Aug 23 '12 at 12:16

6

Yeah you can use

$(function(){
  $('#login_var').text('Ok').button('refresh');
});

As per http://jquerymobile.com/test/docs/buttons/buttons-methods.html, there are only three methods you can call on a button.

answered Aug 23 '12 at 12:16

Arpit Srivastava

2,249
1
16
28

I just need to change the text and not to call the button. As I have a select menu and when you click on certain value I need to change the text of the button. – user123_456 Aug 23 '12 at 12:18
@denonth have a look I edit my changes and copy after – Arpit Srivastava Aug 23 '12 at 12:24

score 6 · Accepted Answer · answered Aug 23 '12 at 12:27

I've had to do the same thing before, it's really not as obvious to do as it should be. Since jQM adds span tags inside your button, you need to change the value inside the span:

$("#login_var .ui-btn-text").text("NewText");

Similarly, if you wanted to change the icon, you could do:

$("#login_var .ui-icon").removeClass("ui-icon-arrow-l").addClass("ui-icon-arrow-r");

Edit: Sorry I just noticed the link you posted in the question has the same solution, and you said that doesn't work for you. Maybe if you changed your buttons to

<a data-role="button"></a>

Instead of <button></button>?

this is actually working. Problem was in – user123_456 Aug 23 '12 at 12:33 — user123_456, Aug 23 '12 at 12:33

how to change a button text in jQuery mobile

2 Answers2