2

I have recently upgraded to Liferay 6.0, JSF 2.1 and jQuery 1.7.

Here is my html form:

 <h:form id="fundRequestForm" action="" method="post">
      <!-- Inside this I have various form field -->
    </h:form>

The form generated in the html page source:

<form id="_jpfcpncuivr_A2262_j_id1:fundRequestForm" name="_jpfcpncuivr_A2262_j_id1:fundRequestForm"
method="post" action="">
</form>

I want to disable all the input fields in a form other than the hidden form fields.

here is my javascript for that

jQuery(document).ready(function()
{
  jQuery('form#_jpfcpncuivr_A2262_j_id1:fundRequestForm input[type!="hidden"]').attr('disabled', 'true');
});

The input fields are not getting disabled. Please let me know what is wrong in this code.

Naftali
  • 144,921
  • 39
  • 244
  • 303
Sri
  • 309
  • 1
  • 9
  • 24

2 Answers2

3

While valid in HTML element IDs/names, the colon is a special character in CSS selectors as it represents the start of pseudo selector. You need to escape it in CSS selectors.

jQuery('form#_jpfcpncuivr_A2262_j_id1\\:fundRequestForm input[type!="hidden"]').attr('disabled', 'true');

See also:

Community
  • 1
  • 1
BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
  • 1
    And also do you recommend me using prop over attr? – Sri Jul 06 '12 at 17:36
  • In *your particular case* both works as good. The major difference is in retrieving values only. The general recommended way is however to prefer `prop()` over `attr()`. But again, this won't make any difference in *your particular case*. For more detail, see [`jQuery.prop()` documentation](http://api.jquery.com/prop/). – BalusC Jul 06 '12 at 17:39
-1

Try adding a class to it:

<h:form id="fundRequestForm" action="" method="post" class="someClass">
  <!-- Inside this I have various form field -->
</h:form>

JS:

jQuery(document).ready(function()
{
  jQuery('.someClass input').prop('disabled', true); //<-- use prop NOT attr
});
Naftali
  • 144,921
  • 39
  • 244
  • 303
  • But this form element ID is auto generated especially "_jpfcpncuivr_A2262_j_id1:". This gets appended to the form ID given above "fundRequestForm" – Sri Jul 06 '12 at 17:14
  • And also could you please tell me the difference between using prop and attr? – Sri Jul 06 '12 at 17:16
  • @Sri [See here for the BIG differences between prop and attr](http://stackoverflow.com/q/5874652/561731) – Naftali Jul 06 '12 at 17:17