I'm trying to figure out if there is a way to detect multiple custom HTML-5 attributes (i.e. "data-analytics-exp-name") and aggregate their values (with a delimiter) into a cookie using Adobe DTM without the user being involved (attributes only need to exist on the page and not be clicked on etc.).
I currently have a rule that reads a single custom HTML-5 attribute and performs
what I want using an event type of "element exists" and using:
var currExpName = this.getAttribute('data-analytics-exp-name');
but not sure how to approach for multiples at once?
If you're looking to get all attributes on the page, you will want to use something that can access the whole page. Try the following code:
`document.querySelectorAll("[data-analytics-exp-name]");
This should return all DOM elements containing the attribute data-analytics-exp-name. From there you can parse the array however you'd like to get the concatenated string you're looking for.
Related
I'm trying to loop through the input elements in a form using jQuery so that I can do some lightweight client-side validation. I'm using Django to generate the pages server side and the problem I'm having is that the particular page has many forms dynamically generated so I don't know the id of them before hand. If I did I could easily do the validation.
So in my javascript I'm trying to capture the submit action of the form and when that's found, somehow get the input elements so that I can check the parameters. Here's what I've tried amongst other things:
$(".s-inputs").submit(function(event){
$(this).filter(':input').each(function(){
console.log("Doesn't work");
});
event.preventDefault();
});
I tried including the django code that generates the html forms below but something in the templating system was throwing off Stack Overflow's formatting of it. I don't think it would have been very instructive anyway. Essentially my html is just an arbitrary number of forms on the page each with an arbitrary number of inputs, all dynamically generated server side. The only thing they share in common is the class "s-inputs."
Thanks for any help.
You should use find(), not filter():
$(this).find(':input').each(function(){
console.log("Doesn't work");
});
filter() attempts to filter the currently selected element(s) (which is currently just your form element) and remove anything which isn't what is being filtered on. This will return nothing, as your form element isn't matched by :input.
find() on the other hand searches for any matching selector contained within the currently selected elements. This will match any matching :input element contained within your form.
I am with affiliate programs that give you little forms to put on your website, but often times they're entirely composed of javascript (so, no HTML tags , ID's or classes are inside of them).
These probably pull in forms using AJAX. JS or JQuery cannot display page elements by themselves, for that they need HTML. What you can do is use the Chrome Developer Tools to find the IDs or classes in the form they load in, and then after the AJAX call edit the form from there.
If there's a form then it has to ultimately draw elements into the DOM for the page to render. There's always a way to get at those nodes if you really need to, but if they don't include IDs or names then you'll have to walk the tree and look for specific relationships based on what you see in the finished page. It will definitely be a PITA, but it's doable.
I've created an interactive PDF form in InDesign and I need to perform some heavy JavaScript manipulation on it. The problem is that widget design is overriden when using JavaScript to set the field's value. Here's what a checkbox, for example, should look like when checked:
http://i45.tinypic.com/axl6u.png
However performing:
var f = this.getField("Checkbox");
f.value = "Yes";
in the JS Console results in the widget's appearance defaulting to acrobat's:
http://i49.tinypic.com/11qmm1g.png
I've tried every single widget property documented in Acrobat's Javascript API Reference to no avail. Initially, checking/unchecking using the mouse works fine. Once the value has been set using JS, Acrobat's default black check character is used for all subsequent toggling, including when using the mouse...
How does InDesign export interactive PDFs with custom icons for widgets? Is there any way to enforce the use of those icons using JS in Acrobat Pro? What's the difference between selecting a checkbox or a radio button using the mouse and setting its value using JS?
I have a list of input objects in my DOM, each with a button. When the user clicks one of the buttons, a dialog box is AJAXed. I would like to pass a reference to one of the input objects, depending on which button is clicked, to the dialog box. This way when the dialog box "Okay" button is clicked, it knows which input to manipulate on the original page.
Have I lost you yet? So how can I pass this input node reference to the AJAXed dialog box?
I am trying to steer away from using a global variable to store the node reference. I also do not want to have to give each input a unique id or name as this would force other areas of my code to become more complicated.
I suspect I will end up having to use one of the above solutions, but before I do, is there some way to pass a node reference via an URL without using the node's id or name? Would I have to use a selector index or something?
Note: Using JQuery.
In my opinion IDs would be the most secure way of identifying nodes.
If you don't like this approach then all is left is using structure to identify elements. A generated path string containing parent hierarchy and child element position would probably do the trick. This question about identifying DOM nodes also contains some tips. The consensus there is to use XPath or something alike. This of course will only work if the structure of your page doesn't change too much.
Personally, I like IDs :)
how to use Pager(GridView or ListView) with html link.
is that right that this code is not SEO friendly?
thanks.
You have two questions.
First:
You can implement a pager by using post-backs. Basically you will invoke a server call at each click of a link. And the server would reply with a new page of the dataset. But the asp.net controls submit the form using javascript. It looks like:
link text
So to not use the javascript at all, you could use a HTTP GET only method. This is just one way to do it.
So what you want generated is something that, it will pass to your server a page value using a query string parameter named 'page'.
You can handle that in your aspx page any way you see fit. But it needs to generate some thing like that.
page 2
In the page load of somepage.aspx you handle it.
protected void page_load(EventArgs e){
// check if the page parameter is set in the query string
if(Request.QueryString["page"] != null){
// page is the value of the requested page
var page = Request.QueryString["page"];
}
// bind you data to the control.
}
Then when binding the data to your GridView or ListView you filter the data based on the page requested.
#pre has a good answer for your first question.
Regarding your second about SEO and JavaScript:
JavaScript has to be used correctly. In other words, the html has to have the links and all of the pieces necessary to be read by a spider. If nav elements are injected via JavaScript then you can be assured that a spider will not see them.
You can certainly use JavaScript to change the styling, reposition the pager area or add other attributes but the base anchor tags with the appropriate href attributes have to be present.