CodingForums.com - Debugging help

CodingForums.com (http://www.codingforums.com/index.php)

- Ajax and Design (http://www.codingforums.com/forumdisplay.php?f=55)

- - Debugging help (http://www.codingforums.com/showthread.php?t=250875)

I have always had problems with my AJAX script. I have this ajax script, for these radio buttons:

Code:

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

<!-- 

//Browser Support Code

function loadcheck(){

    document.wv.v[0].checked = true;

}

function ajaxFunction(v){

        var ajaxRequest;  // The variable that makes Ajax possible!

        

        try{

                // Opera 8.0+, Firefox, Safari

                ajaxRequest = new XMLHttpRequest();

        } catch (e){

                // Internet Explorer Browsers

                try{

                        ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");

                } catch (e) {

                        try{

                                ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");

                        } catch (e){

                                // Something went wrong

                                alert("Your browser broke!");

                                return false;

                        }

                }

        }

    ajaxRequest.onreadystatechange = function(){

        if(ajaxRequest.readyState == 4){

            document.getElementById('right').innerHTML = ajaxRequest.responseText;

        }

    

    }

    ajaxRequest.open('GET', "view.php?view=" + v, true);

    ajaxRequest.send(null);

}

//-->

</script>

            <form method="GET" name="wv">

                        <input type="radio" name="v" value="0" onclick="ajaxFunction(this.value)" />Home |

                        <input type="radio" name="v" value="1" onclick="ajaxFunction(this.value)" />Worship |

                        <input type="radio" name="v" value="2" onclick="ajaxFunction(this.value)" />Small Groups |

                        <input type="radio" name="v" value="3" onclick="ajaxFunction(this.value)" />Service |

                        <input type="radio" name="v" value="4" onclick="ajaxFunction(this.value)" />Calendar |

                        <input type="radio" name="v" value="5" onclick="ajaxFunction(this.value)" />Newsletter |

                        <input type="radio" name="v" value="6" onclick="ajaxFunction(this.value)" />Contact

            </form>

And view.php contains this:

PHP Code:


		
			
<?php

$view = $_GET['view'];

switch ($view) {

    case 1:

        $myFile = "main.txt";

        $fh = fopen($myFile, 'r');

        $theData = fread($fh, 5);

        fclose($fh);

        echo $theData;

        break;

    case 1:

        $myFile = "worship.txt";

        $fh = fopen($myFile, 'r');

        $theData = fread($fh, 5);

        fclose($fh);

        echo $theData;

        break;

    case 1:

        $myFile = "groups.txt";

        $fh = fopen($myFile, 'r');

        $theData = fread($fh, 5);

        fclose($fh);

        echo $theData;

        break;

    case 1:

        $myFile = "service.txt";

        $fh = fopen($myFile, 'r');

        $theData = fread($fh, 5);

        fclose($fh);

        echo $theData;

        break;

    case 1:

        $myFile = "calendar.txt";

        $fh = fopen($myFile, 'r');

        $theData = fread($fh, 5);

        fclose($fh);

        echo $theData;

        break;

    case 1:

        $myFile = "newsletter.txt";

        $fh = fopen($myFile, 'r');

        $theData = fread($fh, 5);

        fclose($fh);

        echo $theData;

        break;

    case 1:

        $myFile = "contact.txt";

        $fh = fopen($myFile, 'r');

        $theData = fread($fh, 5);

        fclose($fh);

        echo $theData;

        break;



    default:

        break;

}

?>

And I do, indeed have the ID correct for <div id="right"></div> I made sure of that.

Again, I get this every time I write ajax. I did copy/paste the browser support from tizag (it is tedious, won't work if it doesn't achieve a uniform function, and they said they didn't mind), but I expect that is the only right part.

When I run the script, nothing changes on the page. Any ideas?

Please and thank you.

Your problems are all in the view.php file.
All of your CASE statements are case 1: You need to change that. And your first

Code:

$view = $_GET['view'];

will be a zero, so your first case must be

Code:

case 0:

Your

Code:

$theData = fread($fh, 5);

contained in all cases only reads 5 bytes. Use this to get the entire file.

Code:

$theData = fread($fh, filesize($myFile));

Make those changes and it should work.

I am assuming that in you real code you have a div to display the returning files

Code:

.....

</form>

<div id="right">Info here</div>

</body>

</html>

PS. You now have code to get ajax files. You need to make a php file with

Code:

<?php

echo 'made it';

?>

So you can tell which file if you have a problem with.;)

Quote:

Originally Posted by sunfighter (Post 1190135)

Your problems are all in the view.php file.
All of your CASE statements are case 1: You need to change that. And your first

Code:

$view = $_GET['view'];

will be a zero, so your first case must be

Code:

case 0:

Your

Code:

$theData = fread($fh, 5);

contained in all cases only reads 5 bytes. Use this to get the entire file.

Code:

$theData = fread($fh, filesize($myFile));

Make those changes and it should work.

I am assuming that in you real code you have a div to display the returning files

Code:

.....

</form>

<div id="right">Info here</div>

</body>

</html>

PS. You now have code to get ajax files. You need to make a php file with

Code:

<?php

echo 'made it';

?>

So you can tell which file if you have a problem with.;)

Thanks. I usually get that 5 bytes thing, and it turns out to just be a problem with which case is which for the other, but I was working quickly, so I copied/pasted a lot of it, intending to clean it up later. That doesn't explain my problems with my other AJAX scripts. I'll put them in the next response. Those, I have been working on for literally a year.

This is the form:

Code:

<td width="15%" bgcolor="#6464FF"><script type="text/javascript" src="ajx.js"></script>

                                        <form name="whichview">

                                                <center><form name="whichview">

                                                        <input type="radio" id="wv" value="0" name="wv" onclick="ajaxFunction()" />Home<br />

                                                        <input type="radio" id="wv" value="1" name="wv" onclick="ajaxFunction()" />News<br />

                                                        <input type="radio" id="wv" value="2" name="wv" onclick="ajaxFunction()" />Messages<br />

                                                        <input type="radio" id="wv" value="3" name="wv" onclick="ajaxFunction()" />ChatRoom<br />

                                                        <input type="radio" id="wv" value="4" name="wv" onclick="ajaxFunction()" />Comming soon!<br/>

                                                </form></center></td>

This is the JavaScript:

Code:

//<!-- 

//Browser Support Code

function ajaxFunction()

        {

        var ajaxRequest;  // The variable that makes Ajax possible!



        try

                {// Opera 8.0+, Firefox, Safari

                ajaxRequest = new XMLHttpRequest();

                }

        catch (e)

                {// Internet Explorer Browsers

                try

                        {

                        ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");

                        } 

                catch (e) 

                        {

                        try

                                {

                                ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");

                                } 

                catch (e)

                                {

                                // Something went wrong

                                alert("Your browser broke!");

                                return false;

                                }

                        }

                }

        

        ajaxRequest.onreadystatechange = function()

                {

                if(ajaxRequest.readyState == 4 && xmlhttp.status == 200)

                        {

                        document.getElementByID('centerField').innerHTML = ajaxRequest.responseText;

                        }

                }        

                var view = Document.GetElementById("wv");

                var query = "?view=" + view;

                ajaxRequest.open("GET", "wv.php" + query, true);

                ajaxRequest.send(null);

                

                

        }

//-->

And this is the PHP:

PHP Code:


		
			
<?PHP

    $wv = $_GET['view'] ;

    

    $mysql_host = "************";

    $mysql_database = "********";

    $mysql_user = "*******";

    $mysql_password = "******l";

    



    

    switch($wv)

        {

        case '0':

            ?>

            

            <html>

                <head>

                    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

                    <link rel="stylesheet" href="style.css" />

                    <script type="text/javascript" src="tinyeditor.js"></script>

                    <script type="text/javascript" src="ax1.js"></script>

                    </head>

                    <body>

                        <center><h1>Home: What Are you doing now?</h1><center><br />

                        <center><textarea id="input" style="width:400px; height:200px"></textarea></center>

                        <script type="text/javascript">

                            new TINY.editor.edit('editor',{

                                id:'input',

                                width:584,

                                height:175,

                                cssclass:'te',

                                controlclass:'tecontrol',

                                rowclass:'teheader',

                                dividerclass:'tedivider',

                                controls:['bold','italic','underline','strikethrough','|','subscript','superscript','|',

                                        'orderedlist','unorderedlist','|','outdent','indent','|','leftalign',

                                        'centeralign','rightalign','blockjustify','|','unformat','|','undo','redo','n',

                                        'font','size','style','|','image','hr','link','unlink','|','cut','copy','paste','print'],

                                footer:true,

                                fonts:['Verdana','Arial','Georgia','Trebuchet MS'],

                                xhtml:true,

                                cssfile:'style.css',

                                bodyid:'editor',

                                footerclass:'tefooter',

                                toggle:{text:'source',activetext:'wysiwyg',cssclass:'toggle'},

                                resize:{cssclass:'resize'}

                            });

                        </script>

                        <center><button onclick="statupdate()">Send!</button></center>

            

            <?PHP

            break;

        case '1':

            //Connect to MySQL Server

            mysql_connect($mysql_host, $mysql_user, $mysql_password);

                //Select Database

            mysql_select_db($mysql_database) or die(mysql_error());

            

            echo '<script type="text/javascript" src="ax0.js"></script>';

            

            echo '<html><body><center>

                    <h1>News</h1><form name="status"><select onchange="friendNews()" id="wf">';

                        

                $query = "SELECT * FROM Personal";



                    $qry_result = mysql_query($query) or die(mysql_error());

                        

                        $display_string = '<option>Whose View?</option>';



                        while($row = mysql_fetch_array($qry_result))

                            {

                            $display_string .= '<option>'.$row['FullName'].'</option>';

                            }

                            $display_string .= '</select></form></center>';

                            echo $display_string;

                            echo '<center><div id="Results"></div></center>';

            break;

        

        case '2':

            break;

        

        case '3':

            echo '    <html>

                        <head><title>Social Experiment ChatRoom</title></head>

                        <body>

                            <script type="text/javascript" src="ax5.js"></script>

                            <script type="text/javascript" src="ax6.js"></script>

                            <textarea readonly="true" scrolling="yes" width="100%" height="50%" id="postedText"></textarea>

                            <textarea scrolling="yes" width="50%" height="50%" id="messageText"></textarea>

                        </body>

                    </html>';

        }            

?>

I made a post for this a while ago, but it was never answered. Do you know what the problem could be here? I'll shorten the PHP if you want.

In the first section of code your inputs all have the same ID. This is a huge No No.

In your JS the line

Code:

var view = Document.GetElementById("wv");

is both written wrong(js is case sensitive). it's missing the .value It S/B

Code:

var view = document.getElementById('wv').value;

and even that wont work because of the multiple IDs.

Quote:

Originally Posted by sunfighter (Post 1190659)

In the first section of code your inputs all have the same ID. This is a huge No No.

In your JS the line

Code:

var view = Document.GetElementById("wv");

is both written wrong(js is case sensitive). it's missing the .value It S/B

Code:

var view = document.getElementById('wv').value;

and even that wont work because of the multiple IDs.

So I need to use document.whichview.wv.value;? Or am I WAY off?

Scriptr you have a workable solution already, why do you need to work on the latest script to achieve what you have?

Quote:

Originally Posted by sunfighter (Post 1190954)

Scriptr you have a workable solution already, why do you need to work on the latest script to achieve what you have?

This is for a social network I have been writing for the past 2 years. all but the first 2 months were spent on the AJAX. The workable solution is for the other one. That is a website I was asked to do for a local church. Then I told my boss that JS couldn't do form submission without using server side script, and the JS isn't really necessary. I haven't heard from him in 3 days. He wanted to use <form action="mailto:address@site.com">...</form>

Oh.... You meant reformat what I have to work in place of the other script that doesn't. :thumbsup: will do.