当使用具有相同处理程序的多个表单时，php处理程

Question

I use the following code to output a table with FAQ.

// get faq
global $wpdb;
$faq = $wpdb->get_results("SELECT ID, q, a, cat, quality, active FROM ce_faq");

foreach ($faq as $i) {
    echo 
    '<div>
        <a id="'.$i->ID.'" class="question" href="#">'.$i->q.'</a>
    </div>
    <div id="a'.$i->ID.'" class="answer">
        <p>'.$i->a.'</p>

        <form method="POST"  id="form'.$i->ID.'">
        <input type="hidden" value="'.$i->ID.'" name="faq_id"></input>
        <input type="hidden" name="action" value="ce_faq_quality"/>'
        .wp_nonce_field( 'name_of_my_action','name_of_nonce_field' ).
        '<p><b> Was this answer usefull? <input type="radio" name="quality" value="1" class="quality_radio"> yes </input><input type="radio" name="quality" value="-1" class="quality_radio"> No </input> </b></p>
        </form>
    </div>';

}

echo '<div id="feedback">feedback</div>';

I use jQuery().slidetoggle to toggle the answers when somebody clicks on the question. I want to enable end-users to give feedback on the questions with a simple yes or no question. The form should be submitted when one of the radio buttons is selected. the trigger jQuery('.quality_radio').click is working and also the formid is correctly fetched.

problem: The function ce_faq_quality(); is unfortunately not responding, when i use console.log(qu) i get for example 'faq_id=1&action=ce_faq_quality&name_of_nonce_field=7dd1d930af&_wp_http_referer=%2Ffaq%2F&quality=1', which seems to be correct to me. I also get the alert 'this is working'. The php handler doesn't seem to work however. the div feedback turns 0 (instead of 'success php function') and also the query isn't performed (while I know it works for 120%). I am at a loss here...

solved: the handler wasn't accessible from the page i was working on...

jQuery('.question').click(
    function(){
       var id = this.id;

        jQuery('#a'+id).slideToggle(350);
    });

jQuery('.quality_radio').click(

    function(){

       var formid = jQuery(this).closest('form').attr('id');
       var formid = '#'+formid;

      jQuery(formid).submit(ajaxSubmit(formid));
      });

        function ajaxSubmit(formid){

            var qu = jQuery(formid).serialize();
            console.log(qu);
        jQuery.ajax({
        type:"POST",
        url: "/wp-admin/admin-ajax.php",
        data: qu,
        success:function(data){
        jQuery("#feedback").html(data);
        alert('this is working');
        }
        });

        return false;
            }

This is the php function i use to process the form.

add_action('wp_ajax_ce_faq_quality', 'ce_faq_quality');
add_action('wp_ajax_nopriv_ce_faq_quality', 'ce_faq_quality');

function ce_faq_quality(){

    $quality = 1; //$_POST['quality'];
    $faq_id =  1; //$_POST['faq_id'];

    global $wpdb;
    $wpdb->query($wpdb->prepare("UPDATE `ce_faq` SET `quality`= `quality` + $quality WHERE id = $faq_id"));


    echo 'succes php function ';
    die();
}

Answer 1

Your formid variable falls out of scope in the ajaxSubmit function. You should instead try:

jQuery('.quality_radio').click(

    function() {

        var formid = jQuery(this).closest('form').attr('id')
        var formid = '#' + formid;

        jQuery(formid).submit(ajaxSubmit(formid));
});

function ajaxSubmit(formId) {

    var qu = jQuery(formid).serialize();

    jQuery.ajax({
        type: "POST",
        url: "/wp-admin/admin-ajax.php",
        data: qu,
        success: function(data) {
            jQuery("#feedback").html(data);
        }
    });

    return false;
}

So that you pass the formid to the ajaxSubmit function.