0

Here is my code. I would like to get the text from the span associated with the input with in LI while submitting the form and after page reloads the text should stick to the div with id "getSpan"

<html>
<head>
</head>
<body>
<form id="myForm" action="so.php" method="get">
    <li><span>some text1</span><input name="Load" type="submit" value="Google" /></li>
    <li><span>some text2</span><input name="Load" type="submit" value="MSN" /></li>
    <li><span>some text3</span><input name="Load" type="submit" value="Yahoo" /></li>
</form>     
<div id="container">
    <?php
        if (isset($_GET['Load'])) {
            $value = $_GET['Load'];
            echo "<iframe width=\"560\" height=\"349\" src=\"http://www.{$value}.com\"></iframe>";
        }
    ?>
    <div id="getSpan"></div>
</div>
</body>
</html>

I tried using hidden type input but the url is showing 2 parameters one for the main input and other for the hidden input which I am trying to avoid.

UPDATE I also tried mixed get and post as suggested by @Paul S but if I use the post method, I cant bookmark the URL's. Someone please help me in solving this issue.

Thanks.

Dharma
  • 78
  • 1
  • 1
  • 9
  • why you don't use javascript to make it done? its more easier to do same thing with jquery or javascript – Mohammad Ahmad Nov 14 '12 at 23:29
  • But I need a form with get method to show the query in URL after form submission. I am not sure if this can be done with javascript. Is that possible ? – Dharma Nov 14 '12 at 23:34
  • 1
    Yes sure, following will help you http://stackoverflow.com/questions/824349/modify-the-url-without-reloading-the-page – Mohammad Ahmad Nov 14 '12 at 23:38
  • Thanks for that but if the page doesnt reload, will the form be submitted ? I tried this with no luck. I need the url to show the query which is dynamic. Here i used static data. If you have any working example kindly share that. Thanks. – Dharma Nov 14 '12 at 23:46

3 Answers3

1

You cannot read any static content that is not being passed via GET/POST. One workaround is to hardcode the return value and match it up with your text, such as:

<?php
    if (isset($_GET['Load'])) {
        $value = $_GET['Load'];
        switch ($value) {
            case 'Yahoo': $myValue = 'some text1'; break;
            case 'MSN':   $myValue = 'some text2'; break;
        }
        echo "<iframe width=\"560\" height=\"349\" src=\"http://www.{$myValue}.com\"></iframe>";
    }
?>
Paul S.
  • 1,527
  • 9
  • 13
  • Actually i posted just a lookalike of my code. In actual I have dynamic content into the input name and value. So I cant use the switch. IS there any workaround that restricts the hidden input's name value pair not to appear in URL after form submission ? – Dharma Nov 14 '12 at 23:32
  • Just use POST? GET requests show up in the URL. POST requests only show up in the header (as in not in myscript.php?stuffhere). – Paul S. Nov 15 '12 at 00:00
  • but I need the main query string to show up in the URL. while the hidden query not to show :( – Dharma Nov 15 '12 at 00:02
  • 1
    You can do a mix of both.
    – Paul S. Nov 15 '12 at 00:04
  • Thanks. tried that. Everything is great. But here comes another problem, I am unable to bookmark the URL's :( – Dharma Nov 15 '12 at 03:00
  • 1
    You need to switch to full GET then. – Paul S. Nov 15 '12 at 04:34
1

jQuery is what you need, plz try :

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js">
</script>
<script type="text/javascript">
    $(function(){
        var formAction = $("#myForm").attr('action');
        $("button.submitBtn").click(function(e){
            var getValue = $(this).text().toLowerCase();
            var spnValue = $(this).parent().find("span:first").text();
            $("#myFrame").attr("src", "http://www."+getValue+".com");
            $("#getSpan").text(spnValue);
            window.history.pushState("","", "so.php?page="+getValue);
        });
    });
</script>
</head>
<body>

<ul>
    <li><span>some text1</span><button class="submitBtn">jQuery</button></li>
    <li><span>some text2</span><button class="submitBtn">MSN</button></li>
    <li><span>some text3</span><button class="submitBtn">digg</button></li>
</ul>     
<div id="container">
<iframe id="myFrame" width="560" height="349" src="http://www.jquery.com">
</iframe>
<div id="getSpan"></div>
</div>
</body>
</html>

There is no forms no reloading, this will work with all modern browser.

BTW, google and yahoo doesn't give you ability to include their pages in iFrame

I hope this help

Mohammad Ahmad
  • 715
  • 8
  • 22
  • Thanks Mohammad for taking your time for my concern. I tried using the same, but just check if I click on the MSN input button, the page URL changes to "..//so.php?page=MSN" Now copy the same url and paste in another browser you wont get that page. Means, you cant bookmark the URL or send the MSN state webpage URL across to your friends to directly land them into the webpage which is currently loaded with MSN. But the default one is shown. If this is not as expected or I am implemwnting this code in wrong way, please correct me. – Dharma Nov 16 '12 at 03:25
0

Thanks Mohammed and Paul. I am able to solve this issue :) I used GET method on form to show the desired query in URL which can be bookmarked while for the other query, I used isset to check form submission and get the value from cache file I created. Thanks Guys.

Dharma
  • 78
  • 1
  • 1
  • 9