Hide, load, and show div with javascript

[mjs]

I have a few pages from each other to interact with page with id load, as below:

inside process.html

<div id="guest_details"> </div>

<div id="first_start"> </div>
<script>
<! -
$('#guest_details').load('?p=guest_details.html');
$('#first_start').load('?p=first_start.html')
$('#guest_details').hide('slow');
$('#first_start').SlideUp('slow')
->
</Script>

inside guest_details.html

<form action="guest_details.php" <form method="POST" id="guest">
<!-- Some cell here -->
<a onclick="$('#guest').submit();" class="button" id="first_start"> <span> <?php echo $button_submit;?> </span> </a>

</Form>

That I want is when the submit button is clicked then:

1. data sent to guest_details.php
2. If the data has been sent then hide <div id="guest_details"> </div>
3. showing the <div show id="first_start"> </div>

but when I make it like the above, that not work, Could someone give a clue how to correct?

Thanks a lot

[Philip M]

a) Your hiding tags <! - and -> are invalid and will cause the script to fail with asyntx error. These comment tags should be <!-- and -->. But the <!-- and //--> comment (hiding) tags have not been necessary since IE3 (i.e. since September 1997).

b) Use <script type = "text/javascript"> rather than simply <script>.

c) Submitting the form reloads the page and starts over. You cannot modify the page after form submission has taken place.


All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.

[mjs]

Thanks Philip M for the corrections, that just my mistyped at here. but i will complete that code, hope someone can help me and I would appreciate it.

Here the complete code:

I have a few pages from each other to interact with page with id load, as below:

inside of page process.html as follows

PHP Code:

    <form action="<?php echo $send; ?>" method="post" id="choose">//data send to process.php and redirect back to ?p=process (process.html page)
    <!--some options here -->
    <a onclick="$('#choose').submit();" class="button"> <span> <?php echo $button_next;?> </span></a>
    </form>
    
    <?php //if ($this->options->hasChosed()) { ?>
    <div id="guest_details"> </div>
    <?php //} ?>
    
    <?php if (isset($this->session->data['guest'])) { ?>
    <div id="first_start"> </div>
    <?php } ?>
    
    <script type="text/javascript">
    <!--
    $('#guest_details').load('?p=guest_details');
    $('#first_start').load('?p=first_start');
    $('#guest_details').hide('slow');
    $('#first_start').show('slow')
    -->
    </Script>

inside of page guest_details.html as follows

PHP Code:

    <form action="<?php echo $send; ?>" method="POST" id="guest">//data send to guest_details.php and redirect back to ?p=process (process.html page)
    <!-- Some cell here -->
    <a onclick="$('#guest').submit();" class="button" id="first_start"> <span> <?php echo $button_next;?> </span></a>
    </Form>

inside of page first_start.html as follows

PHP Code:

    <form action="<?php echo $send; ?>" method="POST" id="_start">/data send to first_start.php and redirect back to ?p=process (process.html page)
    <!-- Some cell here -->
    <a href="<?php echo str_replace($edit_guest_details); ?>" class="button"> <span> <?php echo $edit_guest;?> </span></a>
    <a onclick="$('#_start').submit();" class="button" id="f_start"> <span> <?php echo $button_next;?> </span></a>
    </Form>

situations:

page guest_details.html and first_start.html load inside process.html with using

load('?p=guest_details')
and
load('?p=first_start')

by default guest_details.html is showing and first_start.html is hiding

Goals:
when guest_details.html form submited by click

PHP Code:

<a onclick="$('#guest').submit();" class="button" id="first_start"> <span> <?php echo $button_next;?> </span></a>

then hide the page guest_details.html and show first_start.html

now at first_start.htm page

guest_details.html should be hide even so page refresh(f5), but

when button

PHP Code:

<a href="<?php echo $edit_guest_details; ?>" class="button"> <span> <?php echo $edit_guest;?> </span></a>

clicked then guest_details.html show again

Looking for some pointers, Thanks in Advance

[Kor]

Hide, load, and show div with javascript

It is not native JavaScript syntax, it should be a library/framework, we don't know which, probably JQuery. Or Prototype. Or whichever. Should we guess? Don't confound JavaScript with JavaScript libraries. In the absence of a precise nomination, a coder is not able to guess which, from over 20 different libraries, is that you might have used.

Therefor, you should have posted this Thread in the proper subForum: JavaScript Frameworks. I'll do that for you.

[SB65]

Does indeed look like jQuery to me. The things you are trying to do should be straightforward with jQuery, but it's hard to tell what's going on without your whole page code - preferably the rendered code without php for clarity. Can you post that?