You are viewing limited content. For full access, please sign in.

Question

Question

jQuery selector for field with brackets in the id

asked on November 29, 2016

Hi there,

 

I am trying to reference table fields using jQuery in order to set the values, and change some attributes.

 

My fields include IDs with brackets in them e.g. Field106(1). Using jQuery in console I can set the values, however when I put the code in the CSS and Javascript section of forms it is unable to select using the same selector. I have also tried selecting with name, but the result is the same.

Here is my field example:

<input type="text" id="Field106(1)" name="Field106(1)" aria-label="Field106(1)" class="singleline  required  cf-xlarge user-success" required="True" maxlength="4000" default-val="Test" list="datalist106" data-list-focus="true" value="Test" vo="d">

These are my selectors that I have tried.

$('[id=Field106\\(1\\)]').val();

$("#Field106\\(1\\)").val();

$("input[name=\"Field106\\(1\\)\"]").val();

I am aware of the \\ rule for selectors with special characters, and as mentioned it works in Chrome Developer tools console to grab the value/change attributes etc. But no luck in LF forms. Help!

0 0

Replies

replied on November 30, 2016

This works for me when put in Forms custom script:

$(function(){
  $("#Field6\\(1\\)").click(function(){
    console.log($("#Field6\\(1\\)").val());
  });
});

Can you try using a field without brackets in the id and see if your script works?

3 0
replied on November 30, 2016

A better approve would be to give the table columns class names (.testCol) , then reference the input by $(".testCol input"). If you need to grab the value at a certain row, reference by index. So for getting the 1st column of the first row would be $(".testCol input")[0].val().

 

 

0 0
replied on January 5, 2018 Show version history

Xavier,

I cannot get the "[0]" index to work.

This code works:


//assign max meals allowed 
$(".mealTableQuant").on("click", function(){ 

var maxBFast = $('.totalAllowBFast input').val(); 
$(this).attr('max' , maxBFast ); 
console.log( maxBFast ); 

});

Output:

With the index:

//assign max meals allowed 
$(".mealTableQuant")[0].on("click", function(){ 

var maxBFast = $('.totalAllowBFast input').val(); 
console.log( maxBFast ); 

});
  

Output:

Any suggestions? I love the idea of using the index. Thanks

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.