让问题在Codeigniter中使用多字段表单

时间:2014-04-04 13:50:02

标签: php jquery forms codeigniter

因此,我的表单的一部分包含3" set"的领域。

  • 车辆制作
  • 车辆制造模型
  • 车辆制造车型年

请参阅我正在尝试的屏幕截图:

enter image description here

以下是在此过程中生成的HTML,并且JS遵循

<div class="row small-pad">
                        <div class="col-sm-4">
                            <h5 class="center-text">Make(s)</h5>
                            <small>Click the <i class="fa fa-plus-square-o fa-fw"></i> to add a new field.  Click <i class="fa fa-chevron-right fa-fw"></i> to add models for this make. Click <i class="fa fa-minus-square-o fa-fw"></i> to remove the model/make.</small>
                            <div id="vMake">
                                <div class="input-group">
                                    <input type="text" placeholder="Vehicle Make for This Part" id="PartVehMake" name="PartVehMake[]" class="form-control">
                                    <span style="cursor:pointer;" onclick="$(this).parent().remove();$('#vModel' + $(this).parent().find('input').val()).remove();" class="input-group-addon"><i class="fa fa-fw fa-minus-square-o"></i></span>
                                    <span onclick="addChildGroup('#PartVehMake', 1, '#vModel');" style="cursor:pointer;" class="input-group-addon"><i class="fa fa-chevron-right fa-fw"></i></span>
                                </div>
                            <div class="input-group"><input type="text" placeholder="Vehicle Make for This Part" id="PartVehMake0" name="PartVehMake[]" class="form-control"><span style="cursor:pointer;" onclick="addFormField(1, this);" class="input-group-addon"><i class="fa fa-plus-square-o fa-fw"></i></span><span onclick="addChildGroup('#PartVehMake0', 1, '#vModel');" style="cursor:pointer;" class="input-group-addon"><i class="fa fa-chevron-right fa-fw"></i></span></div></div>
                        </div>
                        <div class="col-sm-4">
                            <h5 class="center-text">Model(s)</h5>
                            <small>Click the <i class="fa fa-plus-square-o fa-fw"></i> to add a new field.  Click <i class="fa fa-chevron-right fa-fw"></i> to add years for this model. Click <i class="fa fa-minus-square-o fa-fw"></i> to remove the make/year.</small>
                            <div id="vModel"><div id="vModelHonda"><h5 style="margin-top:10px;">Honda<span onclick="$('#vModelHonda').remove();" style="cursor:pointer;" class="fa fa-minus pull-right"></span></h5><div class="input-group"><input type="text" placeholder="Vehicle Model for This Make" id="PartVehModel0" name="PartVehModel['Honda']" class="form-control"><span style="cursor:pointer;" onclick="$(this).parent().remove();$('#vYear' + $(this).parent().find('input').val()).remove();" class="input-group-addon"><i class="fa fa-fw fa-minus-square-o"></i></span><span onclick="addChildGroup($(this).parent().find('input'), 2, '#vYear');" style="cursor:pointer;" class="input-group-addon"><i class="fa fa-chevron-right fa-fw"></i></span></div><div class="input-group"><input type="text" placeholder="Vehicle Model for This Make" id="PartVehModel0" name="PartVehModel['Honda']" class="form-control"><span style="cursor:pointer;" onclick="addFormField(2, this, 'Honda');" class="input-group-addon"><i class="fa fa-plus-square-o fa-fw"></i></span><span onclick="addChildGroup($(this).parent().find('input'), 2, '#vYear');" style="cursor:pointer;" class="input-group-addon"><i class="fa fa-chevron-right fa-fw"></i></span></div></div><div id="vModelToyota"><h5 style="margin-top:10px;">Toyota<span onclick="$('#vModelToyota').remove();" style="cursor:pointer;" class="fa fa-minus pull-right"></span></h5><div class="input-group"><input type="text" placeholder="Vehicle Model for This Make" id="PartVehModel0" name="PartVehModel['Toyota']" class="form-control"><span style="cursor:pointer;" onclick="$(this).parent().remove();$('#vYear' + $(this).parent().find('input').val()).remove();" class="input-group-addon"><i class="fa fa-fw fa-minus-square-o"></i></span><span onclick="addChildGroup($(this).parent().find('input'), 2, '#vYear');" style="cursor:pointer;" class="input-group-addon"><i class="fa fa-chevron-right fa-fw"></i></span></div><div class="input-group"><input type="text" placeholder="Vehicle Model for This Make" id="PartVehModel0" name="PartVehModel['Toyota']" class="form-control"><span style="cursor:pointer;" onclick="addFormField(2, this, 'Toyota');" class="input-group-addon"><i class="fa fa-plus-square-o fa-fw"></i></span><span onclick="addChildGroup($(this).parent().find('input'), 2, '#vYear');" style="cursor:pointer;" class="input-group-addon"><i class="fa fa-chevron-right fa-fw"></i></span></div></div></div>
                        </div>
                        <div class="col-sm-4">
                            <h5 class="center-text">Year(s)</h5>
                            <small>Click the <i class="fa fa-plus-square-o fa-fw"></i> to add a new field.  Click <i class="fa fa-minus-square-o fa-fw"></i> to remove the year.</small>
                            <div id="vYear"><div id="vYearCorolla"><h5 style="margin-top:10px;">Corolla<span onclick="$('#vYearCorolla').remove();" style="cursor:pointer;" class="fa fa-minus pull-right"></span></h5><div class="input-group"><input type="text" placeholder="Vehicle Year for This Model" id="PartVehYear0" name="PartVehYear['Corolla']" class="form-control"><span style="cursor:pointer;" onclick="$(this).parent().remove();" class="input-group-addon"><i class="fa fa-fw fa-minus-square-o"></i></span></div><div class="input-group"><input type="text" placeholder="Vehicle Year for This Model" id="PartVehYear0" name="PartVehYear['Corolla']" class="form-control"><span style="cursor:pointer;" onclick="$(this).parent().remove();" class="input-group-addon"><i class="fa fa-fw fa-minus-square-o"></i></span></div><div class="input-group"><input type="text" placeholder="Vehicle Year for This Model" id="PartVehYear0" name="PartVehYear['Corolla']" class="form-control"><span style="cursor:pointer;" onclick="addFormField(3, this, 'Corolla');" class="input-group-addon"><i class="fa fa-plus-square-o fa-fw"></i></span></div></div><div id="vYearHighlander"><h5 style="margin-top:10px;">Highlander<span onclick="$('#vYearHighlander').remove();" style="cursor:pointer;" class="fa fa-minus pull-right"></span></h5><div class="input-group"><input type="text" placeholder="Vehicle Year for This Model" id="PartVehYear0" name="PartVehYear['Highlander']" class="form-control"><span style="cursor:pointer;" onclick="$(this).parent().remove();" class="input-group-addon"><i class="fa fa-fw fa-minus-square-o"></i></span></div><div class="input-group"><input type="text" placeholder="Vehicle Year for This Model" id="PartVehYear0" name="PartVehYear['Highlander']" class="form-control"><span style="cursor:pointer;" onclick="$(this).parent().remove();" class="input-group-addon"><i class="fa fa-fw fa-minus-square-o"></i></span></div><div class="input-group"><input type="text" placeholder="Vehicle Year for This Model" id="PartVehYear0" name="PartVehYear['Highlander']" class="form-control"><span style="cursor:pointer;" onclick="addFormField(3, this, 'Highlander');" class="input-group-addon"><i class="fa fa-plus-square-o fa-fw"></i></span></div></div><div id="vYearPilot"><h5 style="margin-top:10px;">Pilot<span onclick="$('#vYearPilot').remove();" style="cursor:pointer;" class="fa fa-minus pull-right"></span></h5><div class="input-group"><input type="text" placeholder="Vehicle Year for This Model" id="PartVehYear0" name="PartVehYear['Pilot']" class="form-control"><span style="cursor:pointer;" onclick="$(this).parent().remove();" class="input-group-addon"><i class="fa fa-fw fa-minus-square-o"></i></span></div><div class="input-group"><input type="text" placeholder="Vehicle Year for This Model" id="PartVehYear0" name="PartVehYear['Pilot']" class="form-control"><span style="cursor:pointer;" onclick="addFormField(3, this, 'Pilot');" class="input-group-addon"><i class="fa fa-plus-square-o fa-fw"></i></span></div></div><div id="vYearCivic"><h5 style="margin-top:10px;">Civic<span onclick="$('#vYearCivic').remove();" style="cursor:pointer;" class="fa fa-minus pull-right"></span></h5><div class="input-group"><input type="text" placeholder="Vehicle Year for This Model" id="PartVehYear0" name="PartVehYear['Civic']" class="form-control"><span style="cursor:pointer;" onclick="$(this).parent().remove();" class="input-group-addon"><i class="fa fa-fw fa-minus-square-o"></i></span></div><div class="input-group"><input type="text" placeholder="Vehicle Year for This Model" id="PartVehYear0" name="PartVehYear['Civic']" class="form-control"><span style="cursor:pointer;" onclick="addFormField(3, this, 'Civic');" class="input-group-addon"><i class="fa fa-plus-square-o fa-fw"></i></span></div></div></div>
                        </div>
                    </div>

function addFormField(which, initialEle, val){
    var $ct = 0;
    var $nField;
    $iEle = $(initialEle);
    $iEle.find('i').removeClass('fa-plus-square-o');
    $iEle.find('i').addClass('fa-minus-square-o');
    switch(which){
        case 1: // make
            $iEle.attr('onclick', '$(this).parent().remove();$(\'#vModel\' + $(this).parent().find(\'input\').val()).remove();');
            $nField = '<div class="input-group"><input type="text" class="form-control" name="PartVehMake[]" id="PartVehMake'+$ct+'" placeholder="Vehicle Make for This Part" /><span class="input-group-addon" onclick="addFormField(1, this);" style="cursor:pointer;"><i class="fa fa-plus-square-o fa-fw"></i></span><span class="input-group-addon" style="cursor:pointer;" onclick="addChildGroup(\'#PartVehMake'+$ct+'\', 1, \'#vModel\');"><i class="fa fa-chevron-right fa-fw"></i></span></div>';                     
            $('#vMake').append($nField);
            $ct++;
            break;  
        case 2: // model
            $iEle.attr('onclick', '$(this).parent().remove();$(\'#vYear\' + $(this).parent().find(\'input\').val()).remove();');
            $nField = '<div class="input-group"><input type="text" class="form-control" name="PartVehModel[\''+val+'\']" id="PartVehModel'+$ct+'" placeholder="Vehicle Model for This Make" /><span class="input-group-addon" onclick="addFormField(2, this, \'' + val + '\');" style="cursor:pointer;"><i class="fa fa-plus-square-o fa-fw"></i></span><span class="input-group-addon" style="cursor:pointer;" onclick="addChildGroup($(this).parent().find(\'input\'), 2, \'#vYear\');"><i class="fa fa-chevron-right fa-fw"></i></span></div>';                     
            $('#' + $iEle.parent().parent().attr('id')).append($nField);
            $ct++;
            break;  
        case 3: // year
            $iEle.attr('onclick', '$(this).parent().remove();');
            $nField = '<div class="input-group"><input type="text" class="form-control" name="PartVehYear[\''+val+'\']" id="PartVehYear'+$ct+'" placeholder="Vehicle Year for This Model" /><span class="input-group-addon" onclick="addFormField(3, this, \'' + val + '\');" style="cursor:pointer;"><i class="fa fa-plus-square-o fa-fw"></i></span></div>';                     
            $('#' + $iEle.parent().parent().attr('id')).append($nField);
            $ct++;
            break;
        case 4: //options
            $iEle.attr('onclick', '$(this).parent().parent().remove();');
            $nField = '<div id="pOpt'+$ct+'"><div class="col-sm-3"><label class="col-sm-12 control-label" for="PartOptionName">Name: </label><div class="col-sm-12"><input type="text" class="form-control" id="PartOptionName" name="PartOptionName[]" placeholder="New Part Option Name" /></div></div><div class="col-sm-3"><label class="col-sm-12 control-label" for="PartOptionDescription">Description: </label><div class="col-sm-12"><input type="text" class="form-control" id="PartOptionDescription" name="PartOptionDescription[]" placeholder="New Part Option Description" /></div></div><div class="col-sm-3 col-sm-12"><label class="col-sm-12 control-label" for="PartOptionPrice">Price: </label><div class="input-group"><span class="input-group-addon"><i class="fa fa-dollar fa-fw"></i></span><input type="text" class="form-control" id="PartOptionPrice" name="PartOptionPrice[]" placeholder="New Part Option Price" /></div></div><div class="col-sm-3"><label class="col-sm-12 control-label" for="">&nbsp;</label><button type="button" class="btn btn-success" onclick="addFormField(4, this);"><i class="fa fa-plus-square-o"></i></button></div></div>';
            $iEle.parent().parent().parent().append($nField);
            $ct++;
            break;
        case 5: //images
            $iEle.attr('onclick', '$(this).parent().parent().parent().remove();');
            $nField = '<div id="pImg'+$ct+'"><div class="row small-pad"><div class="col-sm-12"><label class="col-sm-2 control-label" for="PartImageName">Name: </label><div class="col-sm-10"><input type="text" class="form-control" id="PartImageName" name="PartImageName[]" placeholder="New Part Image Name" /></div></div></div><div class="row small-pad"><div class="col-sm-12"><label class="col-sm-2 control-label" for="PartImageAlt">Alt Attribute: </label><div class="col-sm-10"><input type="text" class="form-control" id="PartImageAlt" name="PartImageAlt[]" placeholder="New Part Image Alt Attribute" /></div></div></div><div class="row small-pad"><div class="col-sm-6"><label class="col-sm-2 control-label" for="PartImage">Image: </label><div class="col-sm-10"><input type="file" id="PartImage" name="PartImage[]" /></div></div><div class="col-sm-6"><label class="col-sm-3 control-label" for="PartImageMain">Is Main Image: </label><div class="col-sm-9"><input type="checkbox" id="PartImageMain" name="PartImageMain[]" value="1" /> Yes </div></div></div><div class="row small-pad"><div class="col-sm-12"><button type="button" class="btn btn-success pull-right" onclick="addFormField(5, this);"><i class="fa fa-plus-square-o"></i></button></div></div></div>';
            $iEle.parent().parent().parent().parent().append($nField);
            $ct++;
            break;
        case 6:
            $iEle.attr('onclick', '$(this).parent().parent().parent().remove();');
            $nField = '<div id="pVid'+$ct+'"><div class="row small-pad"><div class="col-sm-12"><label class="col-sm-2 control-label" for="PartVideoName">Name: </label><div class="col-sm-10"><input type="text" class="form-control" id="PartVideoName" name="PartVideoName[]" placeholder="New Part Video Name" /></div></div></div><div class="row small-pad"><div class="col-sm-12"><label class="col-sm-2 control-label" for="PartVideoEmbed">Embed Code: </label><div class="col-sm-10"><input type="text" class="form-control" id="PartVideoEmbed" name="PartVideoEmbed[]" placeholder="New Part Video Embed Code" /></div></div></div><div class="row small-pad"><div class="col-sm-12"><label class="col-sm-2 control-label" for="PartVideoActive">Is Active: </label><div class="col-sm-10"><input type="checkbox" id="PartVideoActive" name="PartVideoActive[]" value="1" /> Yes </div></div></div><div class="row small-pad"><div class="col-sm-12"><button type="button" class="btn btn-success pull-right" onclick="addFormField(6, this);"><i class="fa fa-plus-square-o"></i></button></div></div></div>';
            $iEle.parent().parent().parent().parent().append($nField);
            $ct++;
            break;
    }
}

function addChildGroup(val, which, where){
    var $ct = 0;
    var $val = $(val).val();
    var $whr = $(where);
    var $nField;
    if($val.length > 0){
        switch(which){
            case 1: //model
                $whrID = where.replace('#', '') + $val;
                $nField = '<div class="input-group"><input type="text" class="form-control" name="PartVehModel[\'' + $val + '\']" id="PartVehModel'+$ct+'" placeholder="Vehicle Model for This Make" /><span class="input-group-addon" onclick="addFormField(2, this, \'' + $val + '\');" style="cursor:pointer;"><i class="fa fa-plus-square-o fa-fw"></i></span><span class="input-group-addon" style="cursor:pointer;" onclick="addChildGroup($(this).parent().find(\'input\'), 2, \'#vYear\');"><i class="fa fa-chevron-right fa-fw"></i></span></div>';                     
                $whr.append('<div id="' + $whrID + '"><h5 style="margin-top:10px;">' + $val + '<span class="fa fa-minus pull-right" style="cursor:pointer;" onclick="$(\'#' + $whrID + '\').remove();"></span></h5>' + $nField + '</div>');
                $ct++;
                break;
            case 2: //year
                $whrID = where.replace('#', '') + $val;
                $nField = '<div class="input-group"><input type="text" class="form-control" name="PartVehYear[\'' + $val + '\']" id="PartVehYear'+$ct+'" placeholder="Vehicle Year for This Model" /><span class="input-group-addon" onclick="addFormField(3, this, \'' + $val + '\');" style="cursor:pointer;"><i class="fa fa-plus-square-o fa-fw"></i></span></div>';                     
                $whr.append('<div id="' + $whrID + '"><h5 style="margin-top:10px;">' + $val + '<span class="fa fa-minus pull-right" style="cursor:pointer;" onclick="$(\'#' + $whrID + '\').remove();"></span></h5>' + $nField + '</div>');
                $ct++;
                break;  
        }
    }
}

虽然所有这一部分都很有效,但当我尝试使用以下代码将数据添加到数据库时,品牌和模型变得棘手,反过来又使这些年变得棘手。

我怎样才能让它做它应该做的事情?对于每个Make,插入Makes Model,为每个Makes Model插入年份?

// Needs PartID from main part insert
$PartVehMake = $this->input->post('PartVehMake'); 
$PartVehModel = $this->input->post('PartVehModel');
$PartVehYear = $this->input->post('PartVehYear');
for($i = 0; $i < count($PartVehMake); ++$i){
    $make = $PartVehMake[$i];
    $this->db->insert('TblPartVehicleMake', array('partID'=>$PartID, 'pvMake'=>$make));
    $makeID = $this->db->insert_id();
    sleep(.2);
    foreach($PartVehModel as $mkey => $val1){
        $model = $PartVehModel[$mkey];
        $this->db->insert('TblPartVehicleModel', array('pvMakeID'=>$makeID, 'pvModel'=>$model));
        $modelID = $this->db->insert_id();
        foreach($PartVehYear as $ykey => $val2){
            $year = $PartVehYear[$ykey];
            $this->db->insert('TblPartVehicleModelYear', array('pvModelID'=>$modelID, 'pvYear'=>$year));
            sleep(.2);
        }
        sleep(.2);
    }
}

3 个答案:

答案 0 :(得分:0)

从POST数组的索引中删除引号并添加花括号。

name="PartVehModel['Honda']"更改为name="{PartVehModel[Honda]}"

答案 1 :(得分:-1)

您的车辆制造商有非数字键,但您在第一次预告中使用数字键表示这些键。

如果这个答案没有让你开始,我会在稍后尝试编辑答案。

答案 2 :(得分:-1)

尝试从POST阵列的索引中删除引号。

即。 name="PartVehModel['Honda']"变为name="PartVehModel[Honda]"