0

Hey everyone
Please i would like to create a kind of quotation form with 2 ends (front and back). The front end would be a text box and a submit button and the back end would supply the response to the query / request that was inputed in the textbox at the front end. **For example if the word that was typed in the text box is "apple" then the back end would return the word "fruit" on the page , but if the word that was typed in the text box is "cabbage" then the back end would return the word "this is not a fruit". **

Its a silly example but i hope it gives you a better picture of what i am trying to do . Its just a simple script and i really hope someone could help out with this.
Thanks

3
Contributors
8
Replies
71
Views
3 Years
Discussion Span
Last Post by iamthwee
0

Very quick example:

index.php

<html>
<head>
    <title></title>
</head>
<body>


    <input type="text" name="box1" id="stuff" value="" />


    <input id="submit_button" name="submit_button" type="submit" value="Submit" />

    <div class="feedback"></div>


</body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    $('#submit_button').click(function (event) {
        var stuff = $('#stuff').val();
        $.ajax({
            url: 'somefile.php',
            type: 'post',
            data: {stuff:stuff},
            success: function (data) {
                $('.feedback').text("you typed " + data);
            }
        });

    });


</script>

</html>

somefile.php

<?php 
    $var1 = $_POST['stuff'];

    if ($var1 == "apple")
    {
        echo "you typed apple";
    }
    else if ($var1 == "banana")
    {
        echo "you typed banana";
    }
    else
    {
        echo "don't know what you typed";
    }

 ?>
0

@iamthwee . Thanks for your reply, I would try out the code you gave me.

0

Dear newbi11,

I received your message and I believe my sample script does what you want. It displays results without a refresh as it uses jquery ajax technology.

I don't reply to emails so if you have any other queries please post them here as it also makes solutions available to the community.

I think the only issue is styling and customizing the if else statements. If you need help with this then please ask.

0

Hi Iamthwee
I tried the code you gave me , It didn't function. I don't know whats wrong.

0
<html>
<head>
    <title></title>
</head>
<body>


    <input type="text" name="box1" id="stuff" value="" />


    <input id="submit_button" name="submit_button" type="submit" value="Submit" />

    <div class="feedback"></div>


</body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    $('#submit_button').click(function (event) {
        var stuff = $('#stuff').val();
        $.ajax({
            url: 'somefile.php',
            type: 'post',
            data: {stuff:stuff},
            dataType: 'text',
            success: function (data) {
                $('.feedback').text("you typed " + data);
            }
        });

    });


</script>

</html>

Please try adding the dataType: 'text'

0

I included the dataType : 'text' . This time around when i click the submit button nothing happens unlike last time. What's wrong?

0

please make sure the file 'somefile.php' is in the same folder as index.php and is named correctly, no uppercases.

Daft question but you also need an internet connection as well.

Edited by iamthwee

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.