这是我的看法
在id="mystuff"
的第一个选择列表中,我将选择一个选项而不是相关的div
(与选项和类名的值相关。与value="opt1"
和class="mystaff_opt1"
一样,我比较"opt1"
)
将使用java脚本显示。
我想要的是显示div也必须在表单提交后(提交后我的页面指向同一页面)。
<div class="container margin_120">
<div class="row">
<div class="col-lg-9 col-md-9">
<div id="tools">
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
<h4 class="inner margin_5_tb"><i class="icon_set_1_icon-30"></i>Student Scholarship Requests</h4>
</div>
</div>
</div><!--/tools -->
<?php
if (isset($msg)) { echo $msg."<br/>"; }
if ($this->session->flashdata('msg')) { echo $this->session->flashdata('msg')."<br/>"; }
?>
<div class="strip_all_tour_list wow fadeIn padding_15 col-md-12 col-sm-12 col-xs-12" data-wow-delay="0.1s">
<?php $attributes = array("name" => "loanSchPgmStudentAplsForm","id" => "loanSchPgmStudentAplsForm");
echo form_open("trusts/loanSchPgmStudentApls", $attributes); ?>
<div class="row">
<div class="col-md-6 col-sm-6 pull-left">
<div class="form-group">
<legend>Options to Search</legend>
<select class="form-control firstdropdown" name="sel_options" id="mystuff">
<option>Select Options</option>
<option value="opt1">Scholership Programs</option>
<option value="opt2">Family Income</option>
<option value="opt3">Religion</option>
<option value="opt4">Category</option>
<option value="opt5">Gender</option>
<option value="opt6">State</option>
</select>
</div>
</div>
</div>
<div class="col-md-6 col-sm-6 mystaff_hide mystaff_opt1">
<div class="form-group">
<label for="LS_name">Scholarship</label>
<?php
$LSList = [];
if(isset($_REQUEST['LS_name'])){
$LSList = $_REQUEST['LS_name'];
}
?>
<select class="form-control" name="LS_name[]" id="LS_name" multiple="multiple">
<?php foreach($LS_List as $key => $value){ ?>
<option value="<?php echo $value['name']; ?>" <?php if(in_array($value['name'], $LSList)){ ?>selected="selected"<?php } ?>><?php echo $value['name']; ?></option><?php
} ?>
</select>
</div>
</div>
<div class="col-md-6 col-sm-6 mystaff_hide mystaff_opt2">
<div class="form-group">
<label for="Family Income">Family Income</label>
<?php
$fiList = [];
if(isset($_REQUEST['FamilyIncome'])){
$fiList = $_REQUEST['FamilyIncome'];
}
?>
<select multiple class="form-control" name="FamilyIncome[]" id="FamilyIncome">
<option value="1" <?php if(in_array('1', $fiList)){ ?>selected="selected"<?php } ?>>< 40,000 P.A</option>
<option value="2" <?php if(in_array('2', $fiList)){ ?>selected="selected"<?php } ?>>40,000< X < 1,00,000 P.A</option>
<option value="3" <?php if(in_array('3', $fiList)){ ?>selected="selected"<?php } ?>>1,00,000< X < 2,50,000 P.A</option>
<option value="4" <?php if(in_array('4', $fiList)){ ?>selected="selected"<?php } ?>>2,50,000< X < 6,00,000 P.A</option>
<option value="5" <?php if(in_array('5', $fiList)){ ?>selected="selected"<?php } ?>>>6,00,000 P.A</option>
</select>
</div>
</div>
<div class="col-md-6 col-sm-6 mystaff_hide mystaff_opt3">
<div class="form-group">
<label for="Religion">Religion</label>
<?php
$relList = [];
if(isset($_REQUEST['Religion'])){
$relList = $_REQUEST['Religion'];
}
?>
<select class="form-control" name="Religion[]" id="Religion" multiple>
<option value="Hindu" <?php if(in_array("Hindu", $relList)){ echo "selected"; } ?>>Hindu</option>
<option value="Budhism" <?php if(in_array("Budhism", $relList)){ echo "selected"; } ?>>Budhism</option>
<option value="Christian" <?php if(in_array("Christian", $relList)){ echo "selected"; } ?>>Christian</option>
<option value="Jain" <?php if(in_array("Jain", $relList)){ echo "selected"; } ?>>Jain</option>
<option value="Muslim" <?php if(in_array("Muslim", $relList)){ echo "selected"; } ?>>Muslim</option>
<option value="Parsi" <?php if(in_array("Parsi", $relList)){ echo "selected"; } ?>>Parsi</option>
<option value="Sikh" <?php if(in_array("Sikh", $relList)){ echo "selected"; } ?>>Sikh</option>
<option value="Others" <?php if(in_array("Others", $relList)){ echo "selected"; } ?>>Others</option>
</select>
</div>
</div>
<div class="col-md-6 col-sm-6 mystaff_hide mystaff_opt4">
<div class="form-group">
<label for="Category">Category</label>
<?php
$catList = [];
if(isset($_REQUEST['Category'])){
$catList = $_REQUEST['Category'];
}
?>
<select multiple class="form-control" name="Category[]" id="Category">
<option value="General" <?php if(in_array("General", $catList)){ echo "selected"; } ?>>General</option>
<option value="OBC" <?php if(in_array("OBC", $catList)){ echo "selected"; } ?>>OBC</option>
<option value="SC" <?php if(in_array("SC", $catList)){ echo "selected"; } ?>>SC</option>
<option value="ST" <?php if(in_array("ST", $catList)){ echo "selected"; } ?>>ST</option>
<option value="Others" <?php if(in_array("Others", $catList)){ echo "selected"; } ?>>Others</option>
</select>
</div>
</div>
<div class="col-md-6 col-sm-6 mystaff_hide mystaff_opt5">
<div class="form-group">
<label for="Gender">Gender</label>
<?php
$gList = [];
if(isset($_REQUEST['Gender'])){
$gList = $_REQUEST['Gender'];
}
?>
<select multiple class="form-control" name="Gender[]" id="Gender">
<option value="male" <?php if(in_array('male', $gList)){ ?>selected="selected"<?php } ?>>Male</option>
<option value="female" <?php if(in_array('female', $gList)){ ?>selected="selected"<?php } ?>>Female</option>
</select>
</div>
</div>
<div class="col-md-6 col-sm-6 mystaff_hide mystaff_opt6">
<div class="form-group">
<label for="State">State</label>
<?php
$sList = [];
if(isset($_REQUEST['State'])){
$sList = $_REQUEST['State'];
}
?>
<select multiple class="form-control" name="State[]" id="State">
<?php foreach($stateList as $key => $value){ ?>
<option value="<?php echo $value['statename']; ?>" <?php if(in_array($value['statename'], $sList)){ ?>selected="selected"<?php } ?> stateId="<?php echo $value['id']; ?>"><?php echo $value['statename']; ?></option><?php
} ?>
</select>
</div>
</div>
<div class="col-md-6 col-sm-6 mystaff_hide mystaff_opt6">
<div class="form-group">
<label for="District">District</label>
<?php
$dList = [];
if(isset($_REQUEST['District'])){
$dList = $_REQUEST['District'];
}
?>
<select multiple class="form-control" name="District[]" id="District">
<?php foreach($districtList as $key => $value){ ?>
<option value="<?php echo set_value('District') ? set_value('District') :@$districtList->District; ?>" <?php if(in_array($value['city'], $dList)){ ?>selected="selected"<?php } ?>></option><?php
} ?>
</select>
</div>
</div>
<div class="col-md-12 col-sm-12 pull-right" style="margin:15px 0; ">
<button type="submit" class="btn btn-md btn-success">submit</button>
</div>
<?php echo form_close(); ?>
</div><!-- End col lg-9 -->
</div><!-- End row -->
</div><!-- End container -->
<script src="<?php echo base_url(); ?>assets/js/jquery-
1.11.2.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/multi-select/0.9.12/js/jquery.multi-select.min.js"></script>
<script>
$('.mystaff_hide').addClass('collapse');
//on change hide all divs linked to select and show only linked to selected option
$('#mystuff').change(function(){
var selector = '.mystaff_' + $(this).val(); //Saves in a variable the wanted div
$(selector).collapse('show'); //show only element connected to selected option
});
var locState = '<?php echo @$stateList->State; ?>';
var locDistrict = '<?php echo @$districtList->District; ?>';
changeCityList('#District',locState,locDistrict);
});
$(document).on('change', '#State', function() {
var locDistrict = '<?php echo @$districtList->District; ?>';
var cstate = [];
$.each($("#State option:selected"), function(){
cstate.push($(this).val());
});
changeCityList('#District',cstate,locDistrict);
});
function changeCityList(selId,cstate,locDistrict){
var options = "";
$.ajax({
url: '<?php echo site_url("trusts/getCityLists"); ?>',
type: 'GET',
data: {
cstate:cstate
},
dataType: 'json',
success: function(data) {
$(selId).empty();
$.each(data, function(key, value){
if(value.city==locDistrict){
$(selId).append($("<option></option>").attr("value", value.city).text(value.city).attr("selected", 'true'));
}
else{
$(selId).append($("<option></option>").attr("value", value.city).text(value.city));
}
});
}
});
}
<?php if((isset($_POST['LS_name'])) && !empty(isset($_POST['LS_name']))){ ?>
$('.mystaff_opt1').collapse('show');
<?php } ?>
<?php if((isset($_POST['FamilyIncome'])) && !empty(isset($_POST['FamilyIncome']))){ ?>
$('.mystaff_opt2').collapse('show');
<?php } ?>
<?php if((isset($_POST['Religion'])) && !empty(isset($_POST['Religion']))){ ?>
$('.mystaff_opt3').collapse('show');
<?php } ?>
<?php if((isset($_POST['Category'])) && !empty(isset($_POST['Category']))){ ?>
$('.mystaff_opt4').collapse('show');
<?php } ?>
<?php if((isset($_POST['Gender'])) && !empty(isset($_POST['Gender']))){ ?>
$('.mystaff_opt5').collapse('show');
<?php } ?>
<?php if((isset($_POST['State'])) && !empty(isset($_POST['Gender']))){ ?>
$('.mystaff_opt6').collapse('show');
<?php } ?>
</script>
答案 0 :(得分:1)
假设您的表单操作是同一页面,而您的表单操作是POST。 这应该可以解决问题,将此代码写在页面底部。
<?php if(isset($_POST['sel_options']) && !empty($_POST['sel_options'])): ?>
<script>
var selected_option = "<?php echo $_POST['sel_options']; ?>";
var selector = '.mystaff_' + selected_option;
//show only element connected to selected option
$(selector).collapse('show');
</script>
<?php endif; ?>
另一种方式,你也可以使用触发事件。
var selectedFormkey = jQuery('#mystuff').val();
if(selectedFormkey.length > 0){
$('#mystuff').trigger('change');
}
<强>更新强>
试试这个,希望这会对你有所帮助
<?php if(isset($_POST['sel_options']) && !empty($_POST['sel_options'])){ ?>
var selectedOption = "<?php echo $_POST['sel_options']; ?>";
var selector = '.mystaff_' + selectedOption;
$(selector).collapse('show');
<?php } ?>
<?php if(isset($_POST['LS_name']) && !empty($_POST['LS_name'])){ ?>
$('.mystaff_opt1').collapse('show');
<?php } ?>
<?php if(isset($_POST['FamilyIncome']) && !empty($_POST['FamilyIncome'])){ ?>
$('.mystaff_opt2').collapse('show');
<?php } ?>
<?php if(isset($_POST['Religion']) && !empty($_POST['Religion'])){ ?>
$('.mystaff_opt3').collapse('show');
<?php } ?>
<?php if(isset($_POST['Category']) && !empty($_POST['Category'])){ ?>
$('.mystaff_opt4').collapse('show');
<?php } ?>
<?php if(isset($_POST['Gender']) && !empty($_POST['Gender'])){ ?>
$('.mystaff_opt5').collapse('show');
<?php } ?>
<?php if(isset($_POST['State']) && !empty($_POST['State'])){ ?>
$('.mystaff_opt6').collapse('show');
<?php } ?>