getting data by jQuery ajax PHP and Database

Question

my Code not working Exactly as I need, 2 pages php and 1 jquery file to get the data by jquery Ajax. First Page name catfd.php :

 <input type="checkbox" value="2" class="catcf"> catfd2 <br />
 <input type="checkbox" value="35" class="catcf"> catfd35 <br />
 <input type="checkbox" value="22" class="catcf"> catfd22 <br />
 <input type="checkbox" value="133" class="catcf"> catfd133 <br />
 <input type="checkbox" value="28" class="catcf"> catfd28 <br />
 <input type="checkbox" value="33" class="catcf"> catfd33 <br />
 <input type="checkbox" value="55" class="catcf"> catfd55 <br />
 <input type="checkbox" value="44" class="catcf"> catfd44 <br />

and the second page name getvalue.php this page it's given me the right answer if var '$catcfid' is Exactly one I choose from input filed in catfd.php ( i think my problem with Jquery ajax

if(isset($_POST['catcf'])){
$catcfid= $_POST['catcf'];
$sql = 'SELECT * FROM tablename  where cat_id = '.$catcfid.' order by p_id asc';
$catandproid = $wpdb->get_results($sql);
foreach($catandproid as $key){
    echo $key->title;
}

}

this is the jquery ajax file

$(document).ready(function(){
    $(".catcf").on('click', function() {

        if ($('input.catcf').is(':checked')) {        

              
        var catcf = Number($(this).val());
        
            $(".catcf").val(catcf);

            $.ajax({
                url: 'getvalue.php',
                type: 'post',
                data: {catcf:catcf},
                beforeSend:function(){
                    $(".main-area-courses-continer").html("Looding....");
                },
                success: function(response){

                    // Setting little delay while displaying new content
                    setTimeout(function() {
                        // appending posts after last post with class="post"
                        $(".main-area-courses-continer:last").after(response).show().fadeIn("slow");

                
                        
                    }, 2000);


                }
            });
        


            }
        });


});

the code is working but the result gives to me is repeating the first checkbox value I choose its mean jquery didn't change the value of class="catcf" because there unic value for each class. and I will use multiple choices from the checkbox. i want use this checkbox to get different result from database .

Side note: the way you're building your query is unsafe. You're open to SQL injection. You should use prepared statements or PDO instead. — El_Vanja
– El_Vanja, Commented Nov 28, 2020 at 10:50
it's just testing for now, I will keep it in mind , thank you. — v2mpire 20202
– v2mpire 20202, Commented Nov 28, 2020 at 11:03

El_Vanja · Accepted Answer · 2020-11-28 11:06:07Z

1

Your problem is the following line:

$(".catcf").val(catcf);

What's happening here is that you select all of your checkboxes ($(".catcf")) and then change their value attribute to the value of the clicked checkbox. Remove this line and it should work as expected.

answered Nov 28, 2020 at 11:06

El_Vanja

4,0335 gold badges22 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

v2mpire 20202 Over a year ago

is there way i can remove Looding word after loaded ..

El_Vanja Over a year ago

Remove it by setting the content to empty string in the success handler ($(".main-area-courses-continer").html("")). Also, it should be "Loading".

v2mpire 20202 Over a year ago

perfect ,just after loading removing it's like progress bar i don't needed after the data come, thank you so much there another question i will publish hhhh, just if you have time to help I will be grateful to you. just affter i publich i will liv the link for you here . stackoverflow.com/questions/65050236/…

Collectives™ on Stack Overflow

getting data by jQuery ajax PHP and Database

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related