How to select a JSF generated html element using jquery [duplicate] - javascript

This question already has answers here:
How to select JSF components using jQuery?
(4 answers)
Closed 5 years ago.
In my JSF application,one of the html element having the below ID.
FrmOffer:rptOffer:0:j_idt325:0:j_idt355:0:j_idt356:0:j_idt560:0:j_idt632
When I try to select the element using below Jquery lines,
Option 1:
$('#FrmOffer:rptOffer:0:j_idt325:0:j_idt355:0:j_idt356:0:j_idt560:0:j_idt632');
This returns :
Uncaught Error: Syntax error, unrecognised expression: unsupported pseudo: rptOffer
Option 2:
$('#FrmOffer\\:rptOffer\\:0\\:j_idt325\\:0\\:j_idt355\\:0\\:j_idt356\\:0\\:j_idt560:0\\:j_idt632');
This returns:
[]
Can anyone advice how to select the element ?

That way you gonna suffer.
In jsf you can reffer to elements concatenating their parent element's name, if all the elements have an Id:
<h:form id="formId">
<h:inputText id="emailAddresses" value="#{emailAddresses.emailAddressesStr}"/>
var input = document.getElementById('formId:emailAddress');
Maybe that answered question could help you How can I know the id of a JSF component so I can use in Javascript

We can use the native javascript selector instead of jquery.
Below is my code:
document.getElementById('FrmOffer:rptOffer:0:j_idt325:0:j_idt355:0:j_idt356:0:j_idt560:0:j_idt632');

Related

Get element by data-i18n-key [duplicate]

This question already has answers here:
Why does jQuery or a DOM method such as getElementById not find the element?
(6 answers)
Closed 7 days ago.
I'm trying to get an element which is added by an external application. The only way I can get this specific element is by the data-i18n-key attribute which I thought I can grab like any data attribute so something like this.
The code:
const buttons = document.querySelectorAll('[data-i18n-key="sdk.seamless_product_reward.paid_items_required"]');
console.log(buttons.length);
<span class="lion-reward-item__redeem-button-text lion-loyalty-page-reward-item__redeem-button-text" data-i18n-key="sdk.seamless_product_reward.paid_items_required">Paid items required</span>
However, this doesn't return anything. Any ideas how to do this?
Of course, Barmer is absolutely right. Your code works. The problem will be that your JS is initialised before the DOM has finished loading. Pack your JS above the closing body tag.

Find all elements with an 'id' attribute on the DOM [duplicate]

This question already has answers here:
jquery get only all html elements with ids
(3 answers)
Closed 8 years ago.
Simple. I want to traverse the DOM and find all elements that have an id attribute. Can someone help me with a js and/or jquery script
You can query all the elements with an id attribute by using the following jQuery selector:
$("[id]")
You can also just use plain JavaScript using querySelectorAll:
document.querySelectorAll("[id]")
If you want to find non-empty id attributes, use this selector instead:
'[id]:not([id]="")'
Simple attribute selector
$('[id]');
Reference : Has Attribute Selector [name]

Jquery label value [duplicate]

This question already has answers here:
How to change label text?
(3 answers)
Closed 8 years ago.
I'm trying to set the value of label using Jquery. I've tried .HTML(), .Val(), and .innerHTML but nothing seems to work. Any help would be appreciated.
JavaScript
$("#txtObjective").val(responseData[0].objective);
HTML
<label class="puma_Label" id="txtObjective"></label>
Use textContent (.text() in jQuery). Only input elements have a value property.
$("#txtObjective").text(responseData[0].objective);
Mandatory vanilla explanation:
document.getElementById("txtObjective").textContent = responseData[0].objective;
As for the html options -- those are simply bad practice to use here. Unless you're rendering HTML, never use innerHTML or html().

Using :not() with attributes [duplicate]

This question already has answers here:
How can I get the elements without a particular attribute by jQuery
(7 answers)
Closed 9 years ago.
I'm trying to use jquery to grab all select elements which do not have the "multiple" attribute set. I tried with the :not() but I can't get it quite right.
$(document).ready(function() {
$('select:not(multiple)').select2();
});
You forgot the attribute selector. What you're looking for there is "a <select> that is not a <multiple>"
$("select:not([multiple])").select2();
$('select:not([multiple])').select2();
or
$('select').not('[multiple]').select2();

How to find a form using jquery [duplicate]

This question already has answers here:
jQuery selector to get form by name
(4 answers)
Closed 8 years ago.
I have multiple forms on a page. How do I find a form by its name? I think in pure javascript it is something like document.forms['FormName'] .
I want to do a form.submit. But I want to be able to select a form by its name.
You can add an attribute selector to get the form you want:
$('form[name="foo"]')...
No jQuery required -- just use the built-in JavaScript submit() method:
document.forms['FormName'].submit();
Give your form an ID or class attribute. In the case of an ID:
$("#formName").function()
Your HTML:
<form id="formName">
Where function is what you plan on doing...

Categories