Any idea can I use .data attribute in HTML select box?I red HTML5 documents but I didn't find any information that could help me.
Is it legal:
<span>Select depatament</span>
<span>
<select id="department" onchange="EnableSelectBox(this)" data-spacing="10cm">
<option selected disabled>-Select-</option>
</select>
</span>
Yes it fine to use data in Html5 tag. I don't know why you want to use in such a way, but you can use it.
for example like this
$(document).ready(function() {
alert($('#department').data('spacing'));
});
jsfiddle link
Using data attributes
Any attribute on any element whose attribute name starts with data- is a data attribute.
To answer the question: Yes. You can use data attributes on any element.
It works fine. Test in JS using:
alert(document.getElementById("department").getAttribute("data-spacing"))
Related
I know I can select all the HTML elements with a custom attribute by just doing:
$('p[mytag]')
As you can see, I also need to specify the actual HTML div type (a p element in this case). But what if I need to retrieve all the HTML elements irrespective of their type?
Consider this code:
<p>11111111111111</p>
<p mytag="nina">2222222222</p>
<div>33333333333</div>
<div mytag="sara">4444444444</div>
how I can select the 2 html elements (the p and the div) with custom attribute mytag?
You just need to use $("[mytag]")
console.log($("[mytag]"))
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>11111111111111</p>
<p mytag="nina">2222222222</p>
<div>33333333333</div>
<div mytag="sara">4444444444</div>
Use querySelectorAll (javascript) :
document.querySelectorAll('[mytag]');
Or even simpler with jQuery:
$('[mytag]');
I am trying to select an element with a id which has suffix as "_pan1" and it should has class name as oleDiv1 from below code.
<div id="44_div_pan1" class="oleDiv1">
<div id="45_div_pan1" class="oleDiv2">
<div id="47_div_pan1" class="oleDiv1">
<div id="48_div_pan2" class="oleDiv4">
I can get elements using the suffix form ID name using below code
$("*[id$='_pan1']")
but i can not get the combinatined element which has the class oleDiv1
This code is not working $("*[id$='_pan1' .oleDiv1]") .
Please help me to correct the mistakes in my above code.
Thanks
Just combine the selectors without any space between them.
$('[id$=_pan].oleDiv1');
Try this
console.log($("*[id$='_pan1'].oleDiv1"));
Example
You need to use attribute ends with selector:
$('[id$="_pan1"].oleDiv1')
My task is very simple. I'm able to set values to text boxes that come from restful api.. I'm able to get and display on the raw HTML page using {{currentCommodity.commodityName}} But, not able to set values to the select tag even though I'm able to get value.
My code is
$scope.editCommodity = function(commodityIndex) {
console.log("commodities object",$scope.commoditiesAdded[commodityIndex].commodityName);
$scope.currentCommodity.commodityName = $scope.commoditiesAdded[commodityIndex].commodityName;
}
It returns a commodity name with paddy..
My HTML code
---{{currentCommodity.commodityName}}-
<select class="form-control selection_size" ng-change="selectunits(currentCommodity.commodityName.commodityID)" ng-model="currentCommodity.commodityName" ng-disabled="{{editBusinessFlag}}" ng-options="commodityitem.commodityName for commodityitem in commodityList">
</select>
Any help would be greatly appreciated.
Try following code:
You selected : {{currentCommodity.commodityName}}
<select class="form-control selection_size" ng-model="currentCommodity" ng-options="commodityitem.commodityName for commodityitem in commodityList">
</select>
I am not sure how to select the input below using Javascript selectors. I tried this but that doesn't seem to be correct:
$("input:text[name=[11235]");
<div class="Row-LineDetail A" id="Row1235">
<span class="Col-Label LineIndent1">
</span>
<span class="Col-Dollar">
<input type="text" name="l1235" value="$5,000.00" cols="8" onkeyup="validateNegAmount(this);" onblur="transform(this)" onfocus="removeFormatters(this);this.select();">
</span>
</div>
$('input[name="l1235"]')
That would work if you are using jQuery, as in your example above.
You'll want something like this:
$("input[name='11235']");
Take a look at http://api.jquery.com/category/selectors/attribute-selectors/ for more information about attribute selectors.
Since you appear to be using jQuery the following would work:
$("input[name='l1235']")
with using jquery
$('input[name="l1235"]')
with pure javascript
document.getElementsByName('l1235')
For you
Simply use
$('input[name=l1235]');
Other method
If you want to select the text elements, then you can ues
$('input[type=text]');
Other queries can be executed after this such as:
if($(this).attr('name') == 'l1235') {
And so on! :)
I am dynamically finding the string of open tag within a page and want to use JQuery to get the text of the element that the open tag corresponds to.
For example, suppose this is my page:
<h1 class="articleHeadline">
<NYT_HEADLINE version="1.0" type=" ">
The Arab Awakening and Israel
</NYT_HEADLINE>
</h1>
<author id="monkey" class="mainauthorstyle">
<h6 class="byline">
By
<a rel="author" href="http://topics.nytimes.com/top/opinion/editorialsandoped
/oped/columnists/thomaslfriedma/index.html?inline=nyt-per" title="More Articles
by Thomas L.Friedman" class="meta-per">
THOMAS L. FRIEDMAN
</a>
</h6>
</author>
I find the '<author id="monkey" class= "mainauthorstyle">' open tag string, and want to get $("author" id["monkey"] class["mainauthorstyle"]).text() --> By THOMAS L. FRIEDMAN. Is there a simple way to turn the open tag markup into a selector? Should I just parse it with regex?
Edit: I don't know beforehand what element I want. My code looks through the page and comes up with '<author id="monkey" class= "mainauthorstyle">' as the beginning of the element. I don't know the literal beforehand. I run this code on arbitrary webpages.
author#monkey.mainauthorstyle
Here's how you do it: http://jsfiddle.net/peduarte/MgbCX/
I'm having a bit of trouble understanding your question. If you just want the text, use the following:
$("author#monkey.mainauthorstyle").text();
If you want to select the element only if "THOMAS L. FRIEDMAN" is the author, then:
$("author#monkey.mainauthorstyle:contains('THOMAS L. FRIEDMAN')")
// See http://api.jquery.com/contains-selector/ for more info on the :contains() selector
UPDATED AFTER YOUR EDIT:
If you are able to determine that you want to select the "text" of the author element with id of "monkey" and class of "mainauthorstyle", you simply need to build a jQuery selector out of those bits of information. From there you can use the text() or html() methods on the resulting jQuery object to get the contents of that element.
As my example above showed:
$("author#monkey.mainauthorstyle").text();
or
$("author#monkey.mainauthorstyle").html();
Note that the selector used is probably overkill as you should be able to simply select the element by its id.
$("#monkey").text();