Question

我正在尝试使用AJAX将某些值传递到数据库中。使用我当前的脚本，PHP检查提交按钮帖子并处理表单。这是一个标准的表单输入到数据库，但这不是问题，我的表单中的元素不是表单值，它是div中的文本，我试图使用AJAX传递到数据库，我不是完全确定如何去做这件事。我不需要PHP的帮助，这就是为什么我不发布它，我只是需要帮助做AJAX来获取选定的值并将它们传递到数据库。

var Alerts = {
        apu: [["APU Power Fail", "APU[1]"], ["APU Power Fault", "APU[2]"], ["APU Generator Fail", "APU[3]"], ["APU High Oil Temperature", "APU[4]"], ["APU Hot Start", "APU[5]"], ["APU Loss Overspeed Protection", "APU[6]"], ["APU Starter Engaged", "APU[7]"], ["APU Fire", "APU[8]"], ["APU Fails Bite Check", "APU[9]"], ["APU Door Fails to Open", "APU[10]"], ["APU No Flame", "APU[11]"], ["Left Fire Bottle Discharge", "APU[12]"]],

        avionics: [["ADS 1 Fail", "AVIONICS[1]"], ["ADS 2 Fail", "AVIONICS[2]"], ["ADS 3 Fail", "AVIONICS[3]"], ["AP 1 Fail", "AVIONICS[4]"], ["AP 2 Fail", "AVIONICS[5]"], ["Autopilots Fail", "AVIONICS[6]"], ["Baroset 1 Fail", "AVIONICS[7]"], ["Baroset 2 Fail", "AVIONICS[8]"], ["Baroset 3 Fail", "AVIONICS[9]"], ["CCD 1 Fail", "AVIONICS[10]"], ["CCD  2 Fail", "AVIONICS[11]"], ["Heading Comparison Monitor", "AVIONICS[12]"], ["Heading and Roll Comparison Monitor", "AVIONICS[13]"], ["Display Controller 1 Fail", "AVIONICS[14]"], ["Display Controller 2 Fail", "AVIONICS[15]"], ["IRS 1 Fail", "AVIONICS[16]"], ["IRS 2 Fail", "AVIONICS[17]"], ["IRS 3 Fail", "AVIONICS[18]"], ["Glideslope Antenna Fail", "AVIONICS[19]"], ["MAU 1A Fail", "AVIONICS[20]"], ["MAU 1B Fail", "AVIONICS[21]"], ["MAU 2A Fail", "AVIONICS[22]"], ["MAU 2B Fail", "AVIONICS[23]"], ["MAU 3A Fail", "AVIONICS[24]"], ["MAU 3B Fail", "AVIONICS[25]"], ["MRC 1 Fail", "AVIONICS[26]"], ["MRC 2 Fail", "AVIONICS[27]"], ["GPS Degrade", "AVIONICS[28]"], ["GPS #1 Fail", "AVIONICS[28]"], ["GPS #2 Fail", "AVIONICS[30]"], ["Display Unit 1 Fail", "AVIONICS[31]"], ["Display Unit 2 Fail", "AVIONICS[32]"], ["Display Unit 3 Fail", "AVIONICS[33]"], ["Display Unit 4 Fail", "AVIONICS[34]"], ["GPS - Unable RNP", "AVIONICS[35]"]]
    }
    var description, breaker;
    for(var key in Alerts){
        var system = key.toUpperCase();
        $("#systems").append("<div class='systems' id='" +key +"'><div class='select_box'></div><h2>" +system +"</h2></div>");
    }
    $("#systems").on("click", ".systems", function(){
        $("#malfunctions").children().remove();
        $(this).find(".select_box").each(function(){
            $(".selected").removeClass("selected");
            $(this).addClass("selected");
        })
        $.each(Alerts[this.id], function(ind,item){
            description = item[0];
            breaker = item[1];
            $("#malfunctions").append("<div class='systems'><div class='select_box'></div><p data-id='" +description +"'>" +description +"</p></div>");
        })
    })
    $("#malfunctions").on("click", ".systems", function(){
        $(this).find(".select_box").each(function(){
            if($(this).hasClass("selected")){
                $(this).removeClass("selected");
            }
            else{
                $(this).addClass("selected");
                var text = $(this).closest(".systems").text();
            }
        })
    })

右侧显示红色框的div是我想要传递到数据库的所选项目。 enter image description here

Answer 1

你可以这样做：

...

var data = '';
$('.selected').each(function(){
    data += $(this).parent().children('p').attr('data-id') + ',';
})

然后......

$.ajax({
    type: "POST",
    url: "some.php",
    data: { values: data }
})
.done(function( msg ) {

});

这只是方式，而不是复制和粘贴的代码;）

Answer 2

您需要循环遍历元素并将其文本设置为数组，然后您可以通过对象传递数据并通过PHP POST轻松处理它作为一组值：

jQuery(document).ready(function($) {

  var data_values = [];

  $("#malfunctions > .selected").each(function(index, el) {
     data_values[index] = el.innerText;
  });

  $.ajax({
     url: '/path/to/file',
     type: 'POST',
     dataType: 'json',
     data: {myData: data_values}
  })
});

如何使用AJAX将值传递到数据库中

2 个答案: