JavaScript - No Longer Resolved- Why Doesn't This Work? (onclick, Buttons, And Textboxes)

Hi,

I have 4 radio buttons with separate div(s)

I need to click on each radio button to show particular div(s) but I am not getting correct result Lease help

HTML Code
----------

<input type="radio" name="list_prefer_c" id="list_prefer_c" value="1" onClick=\"get_radio_value(1);\" >

<input type="radio" name="list_prefer_c" id="list_prefer_c" value="2" onClick=\"get_radio_value(2);\" >

<input type="radio" name="list_prefer_c" id="list_prefer_c" value="3" onClick=\"get_radio_value(3);\" >

<input type="radio" name="list_prefer_c" id="list_prefer_c" value="4" onClick=\"get_radio_value(4);\" >

<div id="div1" style="display:none">
Facilities Management
</div>

<div id="div2" style="display:none">
<div style="font-weight:bold">Facilities Management, Contracting, MEP, Hydraulic Valves, trading etc…
</div>

<div id="div3" style="background-color:#00B0F0;display:none">
Facilities Management, Contracting, MEP, Hydraulic Valves, trading etc…
</div>

<div id="div4" style="background-color:#00B0F0;display:none">
Facilities Management,Contracting, MEP, Hydraulic Valves, Plumping, LV Switching, Fire alarm & Fire Fighting Trading etc…
</div>

JSCode
--------
function toggleLayer(val)
{
if(val == 1)
{
document.getElementById('div1').style.display = 'block';
document.getElementById('div2').style.display = 'none';
document.getElementById('div3').style.display = 'none';
document.getElementById('div4').style.display = 'none';
}

else if(val == 2)
{
document.getElementById('div1').style.display = 'none';
document.getElementById('div2').style.display = 'block';
document.getElementById('div3').style.display = 'none';
document.getElementById('div4').style.display = 'none';
}

else if(val == 3)
{
document.getElementById('div1').style.display = 'none';
document.getElementById('div2').style.display = 'none';
document.getElementById('div3').style.display = 'block';
document.getElementById('div4').style.display = 'none';
}

else if(val == 4)
{
document.getElementById('div1').style.display = 'none';
document.getElementById('div2').style.display = 'none';
document.getElementById('div3').style.display = 'none';
document.getElementById('div4').style.display = 'block';
}
}

Please delete thread, I went with a JQuery-based solution instead.

Hi

I have created a page using tables and found abit of javascript off the net where I could get a little soundbite to play when an image is clicked. It worked fine.

However I have now converted the page into CSS and even with using the same code the sound no longer plays.

Can anyone share any light on this please??

here is a snippet of my page code that shows the javascript.

Code:

<title>Joho-Designs-Home</title>
<link rel="stylesheet" type="text/css" href="johogallery.css" />
<script language="javascript" type="text/javascript">
 function playSound(soundfile) {
 document.getElementById("dummy").innerHTML=
 "<embed src=\""+soundfile+"\" hidden=\"true\" autostart=\"true\" loop=\"false\" />";
 }
 </script>

 <li><embed name="mySound" src="sounds/SQUEAK3.wav" loop=false autostart=false hidden= true><a href="#" onclick="playSound('sounds/SQUEAK3.wav');"><img src="menu/row3sq3_squeak_OP.png" border="0" alt="1"/></a></li>

Thanks and look forward to replies!!

I have looked at the various posts about setting onclick in IE and I cannot see any that exactly describe the problem I am having.

Firstly I am not trying to set onclick by calling setAttribute, which most of the posts describe. I am simply assigning a value to the onclick attribute of the element, which those posts seem to imply.

Specifically I am getting "Object doesn't support this action" on the following line:
Code:

	editButton.onclick	= editCitation;

editCitation is already a function, so I do not see why I should have to wrap it in an anonymous function wrapper to get IE to permit the assignment.

I have buttons that check all the check boxes and uncheck all the checkboxes. They seem to not be working.

Here is the code.

Javascript
Code:

<script type="text/javascript">
   function checkall(delchk)
   {
      for (i = 0; i < delchk.length; i++)
      delchk[i].checked = true;
   }
</script>

<script type="text/javascript">
   function uncheckall(delchk)
   {
      for (i = 0; i < delchk.length; i++)
      delchk[i].checked = false;
   }
</script>

PHP
PHP Code:
<?php
error_reporting(E_ALL);

require("inc/config.php");
if (isset($_POST['del'])) 
{

    for ($count = 0;$count<count($_POST[delchk]);$count++)
   {
           $delete = $_POST[delchk][$count];
           $query = "DELETE FROM persons WHERE id = '$delete'";
           $result = mysql_query($query);
           if (!$result) 
   {
            die("Error deleting persons! Query: $query<br />Error: ".mysql_error());
        }
    }
}
$result = mysql_query("SELECT * FROM persons");

// Check how many rows it found
if(mysql_num_rows($result) > 0){
echo "<table id=\"mytable\">
<thead>

    <tr>
        <th align=\"center\" scope=\"col\">Delete?</th>
        <th align=\"center\" scope=\"col\">First Name</th>
        <th align=\"center\" scope=\"col\">Last Name</th>
        <th align=\"center\" scope=\"col\">Profile</th>
        <th align=\"center\" scope=\"col\">Date</th>
        <th align=\"center\" scope=\"col\">IP Address</th>
    </tr>
</thead>
<tbody>"; 


echo "<form name = 'myform' action='' method='post'>";
while($row = mysql_fetch_array($result))
  {
  echo "<tr align=\"center\">";
  echo '<td><input type="checkbox" id="delchk" name="delchk[]" value="'.$row['id'].'" /></td>';  
  echo "<td>" . $row['FirstName'] . "</td>";
  echo "<td>" . $row['LastName'] . "</td>";
  echo "<td><a target=frame2 href='" ."profile.php?user1=". $row['FirstName'] ."'>Check Profile</a></td>"; 
  echo "<td>" . $row['AddedDate'] . "</td>";
  echo "<td>" . $row['Ip'] . "</td>";
  echo "</tr>";
  }
echo "</tbody>";
echo "</table>";
echo "<hr>";
echo "<input type='submit' name = 'del' value='Delete Selected'></form>";
echo "<input type='button' onclick='checkall(document.myform[\"delchk[]\"]);' value='Select All'>";
echo "<input type='button' onclick='uncheckall(document.myform[\"delchk[]\"]);' value='UnSelect All'>";

}

else{
// No rows were found ...
echo 'No registered members.'; 
}

mysql_close();
?>

This is a script which has a window slide down on the page and a user can choose yes/no to continue. It works in all browsers other than IE...any help please? If you need more info, please let me know. Thanks.

<script language="JavaScript" type="text/javascript">
<!--
var allowpop=1;
function popWin(){
var ppl="popLayer";var objppl=findObj(ppl);
if (objppl==null){return;}// if the layer does not exist, do nothing.
var args=arguments,movetoX=parseInt(args[0]),movetoY=parseInt(args[1]),movespeed=parseInt(args[2]);
var cycle=10,pxl="";
if(!document.layers){objppl=objppl.style;}
if(objppl.tmofn!=null){clearTimeout(objppl.tmofn);}
var pplcoordX=parseInt(objppl.left),pplcoordY=parseInt(objppl.top);
var xX=movetoX,yY=movetoY;if((pplcoordX!=movetoX)||(pplcoordY!=movetoY)){
var moveX=((movetoX-pplcoordX)/movespeed),moveY=((movetoY-pplcoordY)/movespeed);
moveX=(moveX>0)?Math.ceil(moveX):Math.floor(moveX);movetoX=pplcoordX+moveX;
moveY=(moveY>0)?Math.ceil(moveY):Math.floor(moveY);movetoY=pplcoordY+moveY;
if((parseInt(navigator.appVersion)>4||navigator.userAgent.indexOf("MSIE")>-1) && (!window.opera)) {pxl="px";}
if (moveX!=0){eval("objppl.left='" + movetoX + pxl + "'");}
if (moveY != 0) {eval("objppl.top = '" + movetoY + pxl + "'");}
var sFunction = "popWin(" + xX + "," + yY + "," + movespeed+ ")";
objppl.tmofn = setTimeout(sFunction,cycle);
}
}
function findObj(theObj, theDoc){
var p, i, foundObj;
if(!theDoc) theDoc = document;
if((p = theObj.indexOf("?")) > 0 && parent.frames.length)
{theDoc = parent.frames[theObj.substring(p+1)].document;
theObj = theObj.substring(0,p);}
if(!(foundObj = theDoc[theObj]) && theDoc.all) foundObj = theDoc.all[theObj];
for (i=0; !foundObj && i < theDoc.forms.length; i++)
foundObj = theDoc.forms[i][theObj];
for(i=0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++)
foundObj = findObj(theObj,theDoc.layers[i].document);
if(!foundObj && document.getElementById) foundObj = document.getElementById(theObj);
return foundObj;
}
function hideLayer(layername){
layer=findObj(layername);
if(layer.style){layer=layer.style;}
layer.visibility='hidden'; }

// -->
</script>

I have a few tabs on my website. They're each set to the corresponding id in the JS file. It's supposed to add #tab-1 to the end of the URL in the users browser when it's clicked. For example, when a user is at mypage.com and they click on the tab, it ads mypage.com/#tab-1 to the end. How come it doesn't do what I want when I click it though?

Here's an example of how it's setup.

HTML:

<a href="#tab-1" id="tab1">Text</a>

JavaScript:

document.getElementById("tab1").onclick = function(){
this.href += "#tab-1";
}

I have identical code in my index that works, so I'm just guessing the error is somewhere else, I know IE is not the best target to aim for - but I really want this to work in the windows default browser....

Here is the php page...
PHP Code:
<HTML>
    <HEAD>
        <TITLE>
            Family Home Page
        </TITLE>
        <SCRIPT TYPE="text/javascript" SRC="AddFamilyMemeber.js">
        </SCRIPT>
    </HEAD>
    <BODY>
        <TABLE>
            <TR>
                <TD>Father:</TD>
                <TD>
                    <SELECT ID="Father">
                        <?PHP
                            $con=mysql_connect("localhost","XXXX","XXXX");
                            if (!$con)
                            {
                                die('Could not connect: '.mysql_error());
                            }
                            mysql_select_db("XXXX",$con);
                            $result=mysql_query("SELECT * FROM FamilyMembers");
                            while ($row=mysql_fetch_array($result))
                            {
                                echo "<OPTION VALUE=\"".$row['ID']."\">".$row['FirstName']." ".$row['MiddleName']." ".$row['LastName']."</OPTION>";
                                echo "<BR/>\n";
                            }
                            mysql_close($con);
                        ?>
                    </SELECT>
                </TD>
            </TR>
            <TR>
                <TD>Mother:</TD>
                <TD>
                    <SELECT ID="Mother">
                        <?PHP
                            $con=mysql_connect("localhost","XXXX","XXXX");
                            if (!$con)
                            {
                                die('Could not connect: '.mysql_error());
                            }
                            mysql_select_db("XXXX",$con);
                            $result=mysql_query("SELECT * FROM FamilyMembers");
                            while ($row=mysql_fetch_array($result))
                            {
                                echo "<OPTION VALUE=\"".$row['ID']."\">".$row['FirstName']." ".$row['MiddleName']." ".$row['LastName']."</OPTION>";
                                echo "<BR/>\n";
                            }
                            mysql_close($con);
                        ?>
                    </SELECT>
                <TD>
            </TR>
            <TR>
                <TD>FirstName:</TD>
                <TD><INPUT TYPE="text" ID="FirstName"/></TD>
            </TR>
            <TR>
                <TD>MiddleName:</TD>
                <TD><INPUT TYPE="text" ID="MiddleName"/></TD>
            </TR>
            <TR>
                <TD>LastName:</TD>
                <TD><INPUT TYPE="text" ID="LastName"/></TD>
            </TR>
        </TABLE>
        <BUTTON TYPE="button" ONCLICK="Submit()">Submit</BUTTON>
        <BUTTON TYPE="button" ONCLICK="Abort()">Abort</BUTTON>
    </BODY>
</HTML>

and here is the javascript that works in the index but not here...
Code:

function Abort()
{
	document.location="AddFamilyMember.php";
};

When I load the page everything looks ok, but click on the abort button, and all that happens is that the little error symbol pops in the lower left of IE. The names of the two files are "AddFamilyMember.php" and "AddFamilyMember.js".

Sorry, but I honestly can't see where the problem is....

This is driving me crazy!

So I'm using a javascript file to switch out items when a thumbnail is clicked. This includes photo, title, description, price, size, quantity and add to cart button....

The original code on the html file works fine, but as soon as it is swapped by onclick, the 'add to cart' button does nothing!

Here is the code:

Code:

var addDisplay = document.getElementById('cart-add');
	addDisplay.innerHTML = "<a class='item_add' href='/' onclick='simpleCart.add(); return false;'><img src='images/shop/cart-add.jpg' width='118' height='26' border='0'></a>";

that is what shows in my javascript file...

here is what's on the html file:

Code:

<div id="cart-add"><a class='item_add' href='/' onclick='simpleCart.add(); return false;'><img src="images/shop/cart-add.jpg" width="118" height="26" border="0"></a>
                            </div>

and that adds the item to the cart just fine, but when a thumbnail is clicked on, activating the javascript file to switch out the item/elements, the 'add to cart' button no longer does anything... by the way, I am using simpleCart.js

PLEASE HELP, PLEASE!?

Please PM me if you need more info... or post here if you have a solution. Thanks!

I got this code to WORK with Buttons... But, i can NOT get it to work with URLs/LINKs... dose anyone have any suggestions? The URL alternative LINKs are placed below the buttons... but like i have said, they don't work. Help Pleeeeese. Thanks.


****HEAD
<script language="javascript" type="text/javascript">

function getCheckedValue() {

document.getElementById("presentationsNavBars").style.display = 'block';
document.getElementById("proposalsNavBars").style.display = 'none';
document.getElementById("postingsNavBars").style.display = 'none';
document.getElementById("myaccountNavBars").style.display = 'none';
}

function getCheckedValue2() {

document.getElementById("presentationsNavBars").style.display = 'none';
document.getElementById("proposalsNavBars").style.display = 'block';
document.getElementById("postingsNavBars").style.display = 'none';
document.getElementById("myaccountNavBars").style.display = 'none';
}
function getCheckedValue3() {

document.getElementById("presentationsNavBars").style.display = 'none';
document.getElementById("proposalsNavBars").style.display = 'none';
document.getElementById("postingsNavBars").style.display = 'block';
document.getElementById("myaccountNavBars").style.display = 'none';

}
function getCheckedValue4() {

document.getElementById("presentationsNavBars").style.display = 'none';
document.getElementById("proposalsNavBars").style.display = 'none';
document.getElementById("postingsNavBars").style.display = 'none';
document.getElementById("myaccountNavBars").style.display = 'block';

}
</script>



****** BODY

<div class="student_text">
<asp:RadioButton ID="RadioButton1" GroupName="reg" Text="presentations" runat="server" OnClick="return getCheckedValue();" />
<br /> <%--OR how do i get it to work when using a URL as shown below for example--%>
<a href="navPageTest2.aspx" runat="server" onclick="getClickedValue();">Presentations_link_ex</a><br />
</div>
<br /><br />
<div class="student_text">
<asp:RadioButton ID="RadioButton2" GroupName="reg" Text="proposals" runat="server" onclick="return getCheckedValue2();" />
<br /> <%--OR how do i get it to work when using a URL as shown below for example--%>
<a href="navPageTest2.aspx" onclick="getClickedValue2();">Proposals_link_ex</a><br />
</div>
<br /><br />
<div class="student_text">
<asp:RadioButton ID="RadioButton3" GroupName="reg" Text="postings" runat="server" onclick="return getCheckedValue3();" />
<br /> <%--OR how do i get it to work when using a URL as shown below for example--%>
<a href="navPageTest2.aspx" onclick="getClickedValue3();">Postings_link_ex</a><br />
</div>
<br /><br />
<div class="student_text">
<asp:RadioButton ID="RadioButton4" GroupName="reg" Text="myaccount" runat="server" onclick="return getCheckedValue4();" />
<br /> <%--OR how do i get it to work when using a URL as shown below for example--%>
<a href="navPageTest2.aspx" onclick="getClickedValue4();">Myaccount_link_ex</a><br />
</div>
<br /><br />
****************************** start display *****************************
<br /><br />
<div id="presentationsNavBars" style="display: none;">
SOME HTML HERE ..........presentations nav bar............
</div>
<div id="proposalsNavBars" style="display: none;" >
SOME HTML HERE 44444444 proposals nav bar 44444444444
</div>
<div id="postingsNavBars" style="display: none;" >
SOME HTML HERE 2222222 postings nav bar 2222222222222
</div>
<div id="myaccountNavBars" style="display: block;" >
SOME HTML HERE 33333333 myaccount nav bar 33333333
</div>
<br /><br />
****************************** end *****************************

Hello,

I have a script that lets you add tasks to a task list and then you can click a button to sort them, but I cannot get the "Delete Selected Task" and "Delete All Tasks" buttons to work correctly. I will be eternally indebted to whoever can help me fix these two buttons. The code I am working on is posted below. Thank you for your time.
[CODE]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />

<title>To Do List</title>
<script type="text/javascript">
/* <![CDATA[ */

function addTask() {
if (document.forms[0].newtask.value == "")
window.alert("You must enter a value in the New Task field.");
else {
if (document.forms[0].tasks.options.value == "tasks")
document.forms[0].tasks.options[0] = null;
var newTask = new Option();
newTask.value = document.forms[0].newtask.value;
newTask.text = document.forms[0].newtask.value;
var numTasks = document.forms[0].tasks.options.length;
document.forms[0].tasks.options[numTasks] = newTask;
document.forms[0].newtask.value = "";
}
}

function deleteTask() {
var selectedTask = 0;
var taskSelected = false;
while (selectedTask < document.forms[0].tasks.length) {
if (document.forms[0].tasks.options[selectedTask].selected == true) {
taskSelected = true;
break;
}
++selectedTask;
}
if (taskSelected == true)
document.forms[0].tasks.options[selectedTasks] = null;
else
window.alert("You must select a task in the list.");
}

function ascendingSort() {
var newTasks = new Array();
for (var i =0; i < document.forms[0].tasks.length; ++i) {
newTasks[i] = document.forms[0].tasks.options[i].value;
}
newTasks.sort();
for (var j =0; j < document.forms[0].tasks.length; ++j) {
document.forms[0].tasks.options[j].value = newTasks[j];
document.forms[0].tasks.options[j].text = newTasks[j];
}
}

/* ]]> */

</script>
</head>

<body>

<h1>To Do List</h1>
<form action="">
<p>New Task <input type="text" size="68" name="newtask" /></p>
<p><input type="button" value="Add Task" onclick="addTask()"
style="width: 150px" />
<input type="button" value="Delete Selected Task"
onclick="deleteTask()" style="width: 150px" />
<input type="button" value="Delete All Tasks"
onclick="document.forms[0].task.options.length = 0;"
style="width: 150px" /><br />
<input type="button" value="Ascending Sort"
onclick="ascendingSort()" style="width: 150px" />
</p>
<p><select name="tasks" size="10" style="width: 500px">
<option value="tasks">Tasks</option></select></p>
</form>


</body>
</html>
[CODE]

Hi!

I'm new to JavaScript and I've done some small adjustments to my clients site, but it won't show properly in IE (the shadowbox js at least.). I thought js was accepted in all newer browsers. Do you have a quick fix or idea on why it doesn't work? You can view source on my site, I use mootools, and shadowbox/corners and rightclick blocker.

Is it generally a 'bad thing' to use js in webpages I want everyone to view in the same way? I tried the same effects with CSS but it's not supported in the same way corss-browser, unfortunately. The 'no selection' CSS class I have on the site is also not accepted in IE. It's very annoying!

http://santinacrolla.ihaarr.com/p

thank you in advance!

Below is code using the onmouseover event, but it doesn't work. The only thing that appears in the status bar is the URL.

What am I doing wrong?

Code:

<a href="http://codingforums.com" onmouseover="window.status='This is an OnMouseOver event'; return true" onmouseout="window.status=' '; return true">Put your mouse here to see status info change at bottom.</a>

I've got a form textarea on my site, which after being submitted is stripped by my php file.

Then my javascript kicks in and does some analysis of the entered text. However everytime the user entered a hard return within the textarea my javascript gives me an error 'tekenreeks niet afgesloten' which means something like 'string is not closed'.

Therefore I decided to replace all occurences of chr(10) and chr(13) with
ok2 (just some random characters), I did this with php which worked fine, and I didn't get the javascript error.

However I need to reshow the entered text (original) to the user, so I need to restore the old values. I tried Code:

result.waarde.replace('ok2', 'chr(13)');

but it doesn't work, as it still displays ok2.

I'm no expert in javascript, but how can I replace those characters by the hard returns?

Oh yeah I'll show some more coding, perhaps the error can be found the
Code:

result.waarde.replace('mdw', 'chr(13)');container.innerHTML = result.waarde;

and in my html:
Code:

<div id='waarde' style="width:500px;"></div>

Hi!

What am doing wrong? The script works -- identifies blank fields -- but the second function (change_subject) is ignored.

This is the script:

Code:

<HEAD>
<script>
  function is_filled()  
  {
    if (form_1.realname.value=="")
      {
        alert("Please enter your name")
        form_1.realname.focus()
        return false
      }
    if (form_1.subject.value=="")
      {
        alert("Please enter a subject")
        form_1.message.focus()
        return false
      }
else
return true
  };
  function change_subject
  {
  form_1.subject.value="form_1.realname.value + '_' + form_1.subject.value"
  };
</script>
</HEAD>

This is the FORM (used for MSA FormMail):

Code:

	  <form  name="form_1"; onSubmit="return is_filled()"; on Submit="change_subject()"; method="post"; action="http://gb2gf.org/cgi-sys/FormMail.cgi">
	  <input type="hidden" name="recipient"    value="drt@gb2gf.org">
	  <input type="hidden" name="required"     value="greeting,realname,city_state,email_1,email_2,message">
	  <input type="hidden" name="sort"         value="order:greeting,realname,city_state,email_1,email_2,message">
	  <input type="hidden" name="redirect"     value="http://www.gb2gf.org/thanks.htm">

<!-- Input fields here -->

           </form>

Thanks!

Dr. T.