|
I have a source file in XML which I need to read in with javascript.
Now I use the XmlDocument object, but I find it very user-unfriendly.
Is there a library someone can recommend that will do the job better?
thanks!
|
|
|
|
|
It would probably help if you explained exactly what the problem is. SDKs/libraries are generally designed to help developers solve problems; user-friendliness are rarely a consideration.
|
|
|
|
|
Right now I'm using constructs like this:
xml.getElementsByTagName("group")[0].childNodes[1].childNodes[0].childNodes[0].childNodes[0].nodeValue;
to get a value from some part of the XML.
But the XML could change slightly and so this goes wrong. I "could" check each and every node for the right value, but that would end up being terribly complicated as far as I can see. Mainly because it seems that a node is not only a tag, but also the value in the tag.
I tried XML transforms (xsl) , but the transform to html didn't work. (I looked it up and apparently there are some issues with javascript and xml transforms)
So simply put, I need to traverse the node tree (or "tag tree") in a simpler and easier way.
obsolete to say XML is not really my thing 
|
|
|
|
|
V. wrote: xml.getElementsByTagName("group")[0].childNodes[1].childNodes[0].childNodes[0].childNodes[0].nodeValue;
is exactly the sort of code that leads to trouble. You need to traverse in a logical fashion starting at the top node, and at each point check whether the child is the correct one you are looking for.
|
|
|
|
|
indeed, that's the whole point. I find this XmlDocument system far too complicated or I'm using it wrong somehow. I'm not against loops and if's/switch statements, but it would end up ridiculously complicated in my opinion.
eg.
<xml>
<mytag>the value of this tag</mytag>
</xml>
if you get to the tag "mytag" you get 2 nodes: one for the "mytag" and one for the contents of mytag ("the value of this tag").
In my mind, I would call "getValue" or something on the mytag node to get the contents. In XmlDocument you need to call the childnode first before getValue. Which is just weird.
|
|
|
|
|
Modern versions of Javascript have querySelector() and querySelectorAll(), which are a lot easier to use than traversing the tree - check your documentation (and document object) to see if you have them. You can basically pick out nodes using CSS selectors.
As an alternative there is XPath - it uses expressions to drill down into the tree, just not in the familiar CSS-way that querySelector and querySelectorAll do it.
The querySelector/querySelectorAll functions are available in all the modern browsers, but it looks like XPath is in everything apart from Internet Explorer.
|
|
|
|
|
thanks! I'll certainly have a look at that.
|
|
|
|
|
Greetings experts.
I have used this script before on page with Next, Previous, Submit code and it worked then.
Now, I am trying to use it on a similar application where users will fill the first page and click Next to go to the next page.
Usually, if a required field is not completed and the user clicks Next, a message will display warning the user that a required field must be filled up with the message displaying next to that field.
With the script, you could click Next without completing a required field and it will go to the next page.
You could even click submit and your data will submit without being asked to complete required fields.
What am I doing wrong?
<script type="text/javascript">
$(document).ready(function () {
$("#msform").validate({
rules: {
certsel: "required",
ssn1: "required",
ssn2: "required",
ssn3: "required",
fname: "required",
lname: "required",
email: {
required: true,
email: true
},
address: "required",
city: "required",
county: "required",
state: "required",
zip: "required",
birthmon: "required",
birthday: "required",
birthyr: "required",
ed: "required",
ref1name: "required",
ref1loc: "required",
ref1title: "required",
ref1area: "required",
ref1pre: "required",
ref1suff: "required",
ref2name: "required",
ref2loc: "required",
ref2title: "required",
ref2area: "required",
ref2pre: "required",
ref2suff: "required",
ref3name: "required",
ref3loc: "required",
ref3title: "required",
ref3area: "required",
ref3pre: "required",
ref3suff: "required",
convictions: "required",
txtCaptcha: "required",
nmon: "required",
nday: "required",
nyr: "required",
fullname: "required"
}
},
messages: {
certsel: "Please select the position for which you're applyingd.",
ssn1: "Please enter your complete Social Security Number.",
ssn2: "Please enter phone number.",
ssn3: "Please enter your name.",
fname: "Please enter your first and last names.",
lname: "Please enter your first and last names.",
email: "Please enter your email address.",
address: "Please enter your complete Address, including city, state and zip code.",
city: "Please enter your complete Address, including city, state and zip code.",
county: "Please enter your complete Address, including city, state and zip code.",
state: "Please enter your complete Address, including city, state and zip code.",
zip: "Please enter your complete Address, including city, state and zip code.",
birthmon: "Please enter your birth month, day and year.",
birthday: "Please enter your birth month, day and year.",
birthyr: "Please enter your birth month, day and year.",
ed: "Please enter your highest level of education or if you have a GED.",
ref1name: "Please enter all information for refrence 1.",
ref1loc: "Please enter all information for refrence 1.",
ref1title: "Please enter all information for refrence 1.",
ref1area: "Please enter all information for refrence 1.",
ref1pre: "Please enter all information for refrence 1.",
ref1suff: "Please enter all information for refrence 1.",
ref2name: "Please enter all information for refrence 2.",
ref2loc: "Please enter all information for refrence 2.",
ref2title: "Please enter all information for refrence 2.",
ref2area: "Please enter all information for refrence 2.",
ref2pre: "Please enter all information for refrence 2.",
ref2suff: "Please enter all information for refrence 2.",
ref3name: "Please enter all information for refrence 3.",
ref3loc: "Please enter all information for refrence 3.",
ref3title: "Please enter all information for refrence 3.",
ref3area: "Please enter all information for refrence 3.",
ref3pre: "Please enter all information for refrence 3.",
ref3suff: "Please enter all information for refrence 3.",
convictions: "Please indicate whether you have had any convictions.",
txtCaptcha: "Please enter the code on above.",
nmon: "Please enter today's date and your full name in the space provided.",
nday: "Please enter today's date and your full name in the space provided.",
nyr: "Please enter today's date and your full name in the space provided.",
fullname: "Please enter today's date and your full name in the space provided."
}
});
});
if ((!$('#msform').valid())) {
return false;
}
</script>
modified 26-Apr-19 11:04am.
|
|
|
|
|
Have you checked that both jQuery and the jQuery Validation scripts are included before this script block?
Have you checked that the <form> element's id is set to "msform"?
Are there any script errors in the browser's developer console?
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
I am so sorry Richard,
I always forget to check the browser developer console for info.
I just did now and it turns out that I did not put jquery validate library at the of the page.
I did just that now it works, sort of.
It displays all the messages before user has a chance to invoke.
We would prefer that the textboxes look normal until user skips required field.
Many thanks for your prompt response as usual.
|
|
|
|
|
samflex wrote: It displays all the messages before user has a chance to invoke.
Probably because you're calling the .valid function immediately, rather than waiting until the form is submitted. 
<script>
...
if ((!$('#msform').valid())) {
return false;
}
</script>
Those lines should probably be inside a handler for the form's submit event:
$("#msform").sumbit(function(evt){
if (!$(this).valid()) {
evt.preventDefault();
}
});
However, I think the jQuery validation library already handles this for you, so they may not be required at all.
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
Now it works perfectly!
Thank you very sir for always coming to the rescue.
Much appreciated.
|
|
|
|
|
How to create edit button to table that is being created dynamically so as to edit the row of a table.
|
|
|
|
|
Create the button as part of the row and have within the buttons attributes appropriate references to it's particular content.
This is a very important technique and I suggest strongly you master the concept of creating references to items concurrently with creating the item.
| Ravings en masse^ |
|---|
| "The difference between genius and stupidity is that genius has its limits." - Albert Einstein | | "If you are searching for perfection in others, then you seek disappointment. If you are seek perfection in yourself, then you will find failure." - Balboos HaGadol Mar 2010 |
|
|
|
|
|
<html>
<head>
<meta charset="UTF-8">
</head>
<body id="body">
<div id="wrapper">
<table align='center' cellspacing=1 cellpadding=1 id="mytable" border=1>
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Action</th>
</tr>
</thead>
<tbody id="tbody">
</tbody>
</table>
</div>
<button onclick='display()'> Display</button>
<!--<script src="get-text.js"></script>-->
</body>
</html>
<script>
var myArray = [{ "name": "aaa", "level": "A" }, { "name": "bbb", "level": "B" }, { "name": "ccc", "level": "C" }];
function display() {
var length = myArray.length;
var htmltext = "";
for (var i = 0; i < length; i++) {
console.log(myArray[i]);
htmltext += "<tr id='table"+i+"'><td>"
+myArray[i].name+
"</td><td>"
+myArray[i].level+
"</td><td><button onclick='edit("+i+")'>Edit</button><button onclick='remove("+i+")'>Remove</button></td></tr>";
}
document.getElementById("tbody").innerHTML = htmltext;
}
function edit(indice) {
var htmltext = "<tr><td><input id='inputname"+indice+"' type='text' value='"
+myArray[indice].name+
"'></td><td><input id='inputlevel"+indice+"' type='text' value='"
+myArray[indice].level+
"'></td><td><button onclick='save("+indice+")'>Save</button><button onclick='remove("+indice+")'>Remove</button></td></tr>";
document.getElementById("table"+indice).innerHTML = htmltext;
}
function save(indice) {
myArray[indice].name = document.getElementById("inputname"+indice).value;
myArray[indice].level = document.getElementById("inputlevel"+indice).value;
var htmltext = "<tr id='table"+indice+"'><td>"
+myArray[indice].name+
"</td><td>"
+myArray[indice].level+
"</td><td><button onclick='edit("
+indice+")'>Edit</button><button onclick='remove("
+indice+")'>Remove</button></td></tr>";
document.getElementById("table"+indice).innerHTML = htmltext;
}
function remove(indice) {
console.log(myArray);
myArray.splice(indice, 1);
display();
}
</script>
modified 6-Nov-19 2:31am.
|
|
|
|
|
Hi there,
I need to insert blank pages in a large PDF doc only once after it finds a specific word on that page and is odd.
For eg: If the page has the word "Print this document" and the page number is 5, then insert a blank page only after it.
If the page has the word "Print this document" and the page number is 6, then insert a blank page before and after it.
If the page does not have the word "Print this document", do nothing.
The code sounds simple but I am just not sure.
Thanks if anyone could help would really appreciate it.
|
|
|
|
|
Are you sure you are going to do this in JavaScript?
|
|
|
|
|
Yes Richard. I am using the JavaScript function in Adobe. Its just that I am not too familiar with find the text in a document, and then insert pages.
|
|
|
|
|
In that case I would suggest studying the Adobe documentation.
|
|
|
|
|
Hi greeting to the comunity!!
I´m trying to display the info from a array json dinamically into an html table, but I'm dont really undertand what I`m doing wrong
so, I`m taking three columns from my MySql Table (Name,city and Provinz),so I need a row for each row of my sql table, if a obtain three rows , that is in total 9 cells,ordered in three rows, 3 each..
onload() on body calls the function
function verDetalleNegocio(){
var localidad=getLocalidad();
var negocio=getNegocio();
var datos={'loc':localidad,'neg':negocio};
var datosS=JSON.stringify(datos);
if(localidad!=="" && negocio!==""){
$.ajax({
type:"POST",
data:"datos="+datosS,
dataType:'json',
cache:false,
url:"<?=$this->basePath("web/negocios/detallenegocioajax")?>",
success:function(datos){
var celdas=datos.length;
var filas=celdas/3;
for(i=0;i<datos.length;i++)
{
$("#tabdat").append("<tr>");
$("#tabdat").append("<td>"+datos[i]+"</td>");
$("#tabdat").append("</tr>");
}
}
});
}else{
return null;
}
}
here, I habe my html table:
</head>
<body onload="verDetalleNegocio()">
<table id="tabdat" class="tablaNeg" border=1>
<thead>
<tr>
<th>Nombre</th>
<th>Localidad</th>
<th>Provincia</th>
</tr>
</thead>
<tbody></tbody>
</table>
</body>
and finally, thatt the way the results are display, I would like to show the rows, one on top of the other, and not one next to the other, hoy could say in the iteration, every three, a new row!!!
Thanks!!!
Nombre Localidad Provincia
Naviera Riazor La Coruña La Coruña Barcos Texeiro La Coruña La Coruña Barcos de Vela Riazor La Coruña La Coruña
|
|
|
|
|
It looks like you are creating a new row for each item in the code:
for(i=0;i<datos.length;i++)
{
$("#tabdat").append("<tr>");
$("#tabdat").append("<td>"+datos[i]+"</td>");
$("#tabdat").append("</tr>");
}
You should move the <tr> tags outside the loop thus:
$("#tabdat").append("<tr>");
for(i=0;i<datos.length;i++)
{
$("#tabdat").append("<td>"+datos[i]+"</td>");
}
$("#tabdat").append("</tr>");
|
|
|
|
|
Hi!!
thanks a lot for your reply!!
unfortunatelly, after the changes you proposed me, I get the same result 
I`ll keep trying!!
|
|
|
|
|
It would help us if you showed the actual code you use, and the HTML that is produced when you run it. You can edit your question and add the update information.
|
|
|
|
|
Hi again!!
thanks for your reply, so I put it down the proposal of a colleage from stackoverflow...there I posted the same question..
so the json array comes from the controller, filtered with json_encode();, this is the copy paste from the Chome debugger..so as you can see, I want to display the array of 9 positions in three
rows one under other, and each with three cells..
0: "Naviera Riazor"
1: "La Coruña"
2: "La Coruña"
3: "Barcos Texeiro"
4: "La Coruña"
5: "La Coruña"
6: "Barcos de Vela Riazor"
7: "La Coruña"
8: "La Coruña"
length: 9
this is the table, with a script, that I dont know if is "key" so that everything goes good..
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="tabdat" border=1 style="margin-top: 300px;">
<thead>
<tr>
<th>Nombre</th>
<th>Localidad</th>
<th>Provincia</th>
</tr>
</thead>
<tbody></tbody>
</table>
</body>
and here is the function verDetalleNegocio(), that I invoke on the body with the onload method, inside I do the
loop, and try to display on the #tabdat, under...
function verDetalleNegocio(){
var localidad=getLocalidad();
var negocio=getNegocio();
var datos={'loc':localidad,'neg':negocio};
var datosS=JSON.stringify(datos);
if(localidad!=="" && negocio!==""){
$.ajax({
type:"POST",
data:"datos="+datosS,
dataType:'json',
cache:false,
url:"<?=$this->basePath("web/negocios/detallenegocioajax")?>",
success:function(datos){
html = "";
for(i=0; i<datos.length; i++){
html += "<tr>"
html += "<td>"+datos[i]+"</td>";
html += "<td>"+datos[i]+"</td>";
html += "<td>"+datos[i]+"</td>";
html += "</tr>";
}
$("#tabdat tbody").append(html);
}
});
}else{
return null;
}
}
and finally the result that I obtain on the screen..as you can see, the information is displayed twice...please, tell me If i can put more infomation...thanks
Nombre Localidad Provincia
Naviera Riazor Naviera Riazor Naviera Riazor
La Coruña La Coruña La Coruña
La Coruña La Coruña La Coruña
Barcos Texeiro Barcos Texeiro Barcos Texeiro
La Coruña La Coruña La Coruña
La Coruña La Coruña La Coruña
Barcos de Vela Riazor Barcos de Vela Riazor Barcos de Vela Riazor
La Coruña La Coruña La Coruña
La Coruña La Coruña La Coruña
|
|
|
|
|
Look at your code, in the loop you are printing the same item html += "<td>"+datos[i]+"</td>"; three times. I showed you what the code should be in my original response.
|
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
