Home/ Questions/Q 7766873
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-01T15:32:01+00:00

I have what is likely a simple problem, whereby I am trying to get

  • 0

I have what is likely a simple problem, whereby I am trying to get a jquery mobile button to be disabled upon page initialization, with the following:

<body>
<section id="firstpage" data-role="page-content">
  <header data-role="header">
    <h1>Working with Buttons</h1>
  </header>
  <div data-role="content">
    <p>This is a &lt;button&gt; element:</p>
    <button id="btn1">button element</button>
  </div>
</section>
<script>
  $("#firstpage").live('pageinit', function (evt) {
    $("#btn1").button("disable");
  });
</script>
</body>

The page loads with all the jquery mobile formatting and behaviors as expected, but the button remains enabled. Any ideas? What very simple detail am I missing here?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Just add the disabled=true attribute. jQuery Mobile will read that attribute and initialize the widget as disabled.

    Here is a demo: http://jsfiddle.net/CDYgD/

    Also, data-role="page-content", page-content is not a valid jQuery Mobile data-role for a pseudo-page element, it should be just page unless you’ve made some type of customization. Docs for this: http://jquerymobile.com/demos/1.1.0-rc.2/docs/api/data-attributes.html (look for Page header)

    • 0