2

I have a button, on its click i wish to run ajax that will call php script result and display data under a particular div. however its not working this way and when i checked the console no value is getting passed to ajax.

can anyone plz correct the code

<script>

$(document).ready(function(){
    $('#generate').change(function(){

        var generateid = $('#generate').val();
        console.log($('#generate'))
        if(generateid != 0)
        {

            $.ajax({
                type:'post',
                url:'a_generatecoupon.php',
                data:{id:generateid},
                cache:false,
                success: function(returndata){
                    $('#coupon_detail').html(returndata);
                    console.log(returndata)
                }
            });

        }
    })
})
</script>

<div class="form-group">
    <label class="control-label col-md-3"> Coupon Code</label>
    <div class="col-md-3">
        <div type="submit" class="btn green" id="generate">Generate</div>
    </div>
</div>

<div id="coupon_detail">

</div>

a_generatecoupon.php code

<?php
function getRandomCode(){
    $an = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ-)(.:,;";
    $su = strlen($an) - 1;
    return substr($an, rand(0, $su), 1) .
            substr($an, rand(0, $su), 1) .
            substr($an, rand(0, $su), 1) .
            substr($an, rand(0, $su), 1) .
            substr($an, rand(0, $su), 1) .
            substr($an, rand(0, $su), 1);
}

?>  

<label class="control-label col-md-3"> Coupon Code</label>
<div class="col-md-3">
    <?php echo getRandomCode(); ?>
</div>
13
  • why you use '<div type="submit" ' ? $('#generate').val(); should be value of submit? Commented Jul 10, 2015 at 10:11
  • @Luca Olivieri this code is inside a form if i try to use button tag then it behaves as form and gets redirected to another page and skips ajax, it is something i am just trying Commented Jul 10, 2015 at 10:14
  • @lshettyl html part is below script part Commented Jul 10, 2015 at 10:15
  • Both type="submit" & type="button" ? $('#generate').val(); where in html you put this number code? Commented Jul 10, 2015 at 10:17
  • A div has no type, no change() method and no val() method! Commented Jul 10, 2015 at 10:21

1 Answer 1

1

i changed the change to click event now you script is working. add the button too..

<script>

    $(document).ready(function(){
        $('#generate').click(function(){

            var generateid = $('#generate').val();
            console.log($('#generate'))
            if(generateid != 0)
            {

                $.ajax({
                    type:'post',
                    url:'a_generatecoupon.php',
                    data:{id:generateid},
                    cache:false,
                    success: function(returndata){
                        $('#coupon_detail').html(returndata);
                        console.log(returndata)
                    }
                });

            }
        })
    })
    </script>

    <div class="form-group">
        <label class="control-label col-md-3"> Coupon Code</label>
        <div class="col-md-3">
            <input type="submit" class="btn green" value="Generate" id="generate">
        </div>
    </div>

    <div id="coupon_detail">

    </div>
Sign up to request clarification or add additional context in comments.

1 Comment

was redirecting to another page, carrying the form action but removing type="submit" seemed to work