Hello everybody. I’m new here and I would really need some help.
I have a form which sends SMS to mobiles. Inside this form there is a button that makes a hidden div visible with data coming with ajax (contacts of the user). This data is inside a form which is inside a table all made with javascript. So we choose the contacts that we want to send the sms (with checkboxes) and then click on another button which will put the data of the choosen contacts inside my first form and hide the div. So when this button is clicked, it’s going to a function. The first thing I want is to get the length of the form of the hidden/visible div and I’m doing this with an alert(document.contact_form.length) to see if it is there. In mozilla this alert does not work.An alert with a string works fine so it goes to the function.
In chrome and safari works but the problem here is that it completes the first form!!! that sends the SMS and stores the data in the database.?.
Could anybody help me or if you know where I could search for these kind of differences?
document.contact_form.elements.length will give you the number of form elements in the form. That should work in all browsers.
Thanks for reply.
Unfortunately does not work.
If it doesn’t work, then contact_form doesn’t exist. Is contact_form the name of the form? If not, then that won’t work.
You should really do something cleaner like this:
document.getElementById('contact_form').elements.length;
You should also not be using onchange=“” in the HTML, but attaching event handlers via javascript directly.
This does not work not in mozzilla nor in the other two browsers.
The name of the form exists, as I said it works fine in safari and chrome.
Could it be that the form is created inside the javascript; (mozilla cannot find it?)
The onclick event is written inside the javascript also because the button is created in here.
You must be doing something wrong. Put this in the address bar and press enter:
javascript:alert(document.getElementById('search').elements.length);
It tells you the number of elements in the search form at the top of this very page. I’ve tested it in Mozilla.
I don’t think we’re going to get any further unless you post some HTML and JavaScript.
I did what you told me and it shows me only the elements of the other forms that are included in the page.
I’m sending the code. Hope I did it correct because it’s the first time I use forums.
<div id="content_sms">
<div id="sms_create">
<?php if (!empty($message)) { echo "<p class=\\"message\\">$message</p>"; }?>
<form action="create_sms.php" method="post" name="sms_form">
<label><input class="small" type="hidden" id="user_mobile" name="user_mobile" value="<?php echo $user_mobile; ?>"/></label>
<label><input class="small" type="hidden" id="mycosmos_psw" name="mycosmos_psw" value="<?php echo $mycosmos_psw; ?>"/></label>
<label><button name="theButton" type="button" onclick="clicked()">Επιλογή επαφής:</button> <input id="contact" class="top" type="text" name="contact" onfocus="hideDiv()"/></label>
<label><span>Τηλ.αποστολής: </span><input id="mobile" class="small" type="text" name="mobile" maxlength="10" onkeyup="return ismaxlength(this)"/></label>
<label><span>Θέμα: </span><input class="small" type="text" name="subject" maxlength="30" onkeyup="return ismaxlength(this)" /></label>
<label><span>Κείμενο αποστολής: </span><textarea name="sms_text" id="sms_text" maxlength="140" rows="5" cols="30" onkeyup="return ismaxlength(this)"></textarea></label>
<label><input class="send_button" type="submit" name="submit" value="Αποστολή" onclick="sendClicked()" />
</form>
<div id="ajax_results"> </div>
</div>
</div>
function clicked() {
if (display) {
var hiddenDiv = document.getElementById("ajax_results");
hiddenDiv.style.display = "block";
var selNum = "";
var result = "";
result = result + "<form name=\\"contact_form\\">";
result = result + "<table id=\\"the_table\\"><caption>Επιλογή Επαφής</caption>";
var x = xmlDoc.getElementsByTagName("contact");
for (var i=0;i<x.length;i++) {
selNum = i;
result = result + "<tr><td><input type=\\"checkbox\\" name=\\"select\\" value=\\"" + selNum + "\\" </td><td>"
+ x[i].getElementsByTagName("nickname")[0].childNodes[0].nodeValue + "</td><td>"
+ x[i].getElementsByTagName("mobile")[0].childNodes[0].nodeValue + "</td></tr>";
}
result = result + "<tr><td colspan=\\"3\\"><input type=\\"button\\" name=\\"insert\\" value=\\"Επιλογή\\" onclick=\\"insert_mobile()\\"/></td>";
result = result + "<tr><td colspan=\\"3\\" onclick=\\"hideDiv()\\">Κλείσιμο Παραθύρου</td></tr>"
result = result + "</table></form>";
document.getElementById("ajax_results").innerHTML = result;
display = false;
}
else {
hideDiv();
}
}
function hideDiv() {
var hiddenDiv = document.getElementById("ajax_results");
hiddenDiv.style.display = "none";
display = true;
}
function insert_mobile() {
alert(document.contact_form.elements.length);
}
Think I found what is going on. I asked the alert to bring me the elements of the sms_form, the one that contains the button which calls the clicked() function.
In chrome and safari shows me the number 8 meaning the exact elements I have in my HTML in sms_form.
In mozilla it gives me number 13 meaning the elements in sms_form plus the elements in contact_form.
So I think I will have to make different script for each one of them. Right?
Thanks a lot anyway and I will need you again preety soon I think.