php ajax 复选框总是选中

Question

我有一个表单可以根据收到/检查的数据显示报价。

这是一个非刷新页面，所以它使用ajax获取提交点击，然后将数据发送到php文件。

主要问题是复选框总是被选中，并且正在回显“ON”。我需要复选框正常工作，默认情况下未选中，然后当用户单击它并提交表单时，它们实际上会被选中。

这些是复选框

<div class="checkbox">
        <label><input type="checkbox" name="lighting" id="lighting"><font color="#2C3E50" value="">Lighting</label></font>
        <label><input type="checkbox" name="heating" id="heating"><font color="#2C3E50" value="">Heating</label></font>
        <label><input type="checkbox" name="dancefloor" id="dancefloor"><font color="#2C3E50" value="">Dancefloor</label></font>
        <label><input type="checkbox" name="internaldressing" id="internaldressing" value=""><font color="#2C3E50">Internal Dressing</label></font>
    </div>

我尝试删除 value 属性，我尝试添加 check 属性。从字面上看，没有任何帮助。

这是 AJAX 文件的一部分：

    var dataString = 'eventtype=' + eventtype + '&peoplecount=' + peoplecount + '&location=' + location + '&eventdate=' + eventDate + '&lighting=' + lighting + '&heating=' + heating + '&dancefloor=' + dancefloor + '&internaldressing=' + internaldressing;


    $.ajax({  
    type: 'POST',  
    url: 'process.php',
    data: dataString,
    success: function(data) {
        if( data == '0' )
            alert( 'Błędne dane logowania!!!' );
        else
             $('#results').html(data);

    }  
}); 
        event.preventDefault();

然后我的 PHP 看起来像这样。

if(isset($_POST)){

        // Total price of quote. 
        $price = 0;
        // Prices of extras. 
        $lighting_price = 0;
        $heating_price = 0;
        $dancefloor_price = 0;
        $internaldressing_price = 0;

        // Stage I VARIABLES
        $eventType = $_POST['eventtype'];
        $peoplecount = (int)$_POST['peoplecount'];
        $location = $_POST['location'];
        $eventDate = $_POST['eventdate'];

        // Stage II VARIABLES 
        $lighting = $_POST['lighting'];
        $heating = $_POST['heating'];
        $dancefloor = $_POST['dancefloor'];
        $internaldressing = $_POST['internaldressing'];

        // If there are less than 70 guests then make base price 650. 
        if($peoplecount < 70){
            $price = $price + 650;
            $lighting_price = 75; 
            $heating_price = 150;
        }

        // If there are between 71 and 130 guests then make base price 950.
        if(($peoplecount >= 71) && ($peoplecount <= 130)){
            $price = $price + 950;
            $lighting_price = 150;
            $heating_price = 250;
        }

        if (isset($_POST['lighting'])){
            echo "IM TICKEED!!!!!!!";
        }

        if (isset($_POST['heating'])){
            echo "IM TICKEED!!!!!!!";

        }

        echo $eventType . "<br>";
        echo $peoplecount . "<br>";
        echo $lighting . "<br>";
        echo $heating . "<br><br>";
        echo $price;

        }

感谢您的帮助。

Answer 1

第一件事。请在您的复选框中添加值属性。它们将作为值传递给您的 url。

请检查复选框是否被选中。尝试把选中的伪选择器。

$('#lighting:checked').val()

如果未选中该复选框，则它会给您未定义的值，因此请在分配值时检查该条件。

 var lighting = ($('#lighting:checked').val() === undefined )? null : $('#lighting:checked').val(); 

上面的行不会对代码产生太大影响，但有东西是件好事。

在将它分配给您的数据字符串变量时，您可以检查它是否为空或未定义，然后像这样附加字符串。如果变量有一个值，则将其附加到您将作为 ajax url 传递的数据字符串变量中。

希望这能解决您的问题。

Answer 2

在javascript ajax语法中，将此代码放在ajax请求成功函数中

document.getElementById('lighting').checked = false;

通过更改 id 名称对其他复选框执行此操作