Question

这是我的代码。我想在选择框和showdefault（）的每个选项值上调用MaxSize（）函数，当值==＆＃34;地址＆＃34;和 EnableRangeSearch（）当值==＆＃34;复选框＆＃34;。我可以执行此操作。任何人都可以建议我错在哪里

＆＃13;

$(document).ready(function(){
        $("select").change(function(){
                if(document.getElementById("data_type").value=="Address"){
                  //MaxSize() is function defined in function.php page
					MaxSize();
                }
              if(document.getElementById("data_type").value=="Checkbox"){
                  //EnableRangeSearch() is function defined in function.php page
                    EnableRangeSearch();
                }
        });
    });

＆＃13;

<select class="form-control" name="data_type" id="data_type"> 
		<option value="Text Fields" id="TextFields">Text Fields</option>
		<option value="Address" id="Address">Address</option>
		<option value="Checkbox">Checkbox</option>
		<option value="Currency">Currency</option>
</select>

<?php include  'function.php'; 
        //fields is a class name
		$qwerty=new fields;
		$qwerty->showdefault();
?>

＆＃13;

Answer 1

试试这个

    $("#data_type").change(function () {
        showdefault();
        if ($(this).val() == "Address") {
            MaxSize();
        } else if ($(this).val() == "Checkbox") {
             EnableRangeSearch();
        }

    });

你需要为showdefault（），MaxSize（）和EnableRangeSearch（）定义javascript函数。

Answer 2

首先为所有选择选项创建函数，然后调用showdefault（）函数，在该函数中调用所选选项的函数。例如：见下文

//this script for sending `id` of dropdown option to results.php page
$('#data_type option').on('click', function(){
$.get('miniresults.php', 
  {
	option: this.id 
  },
function(data){
	$('.show_contain').html(data); //do something with whatever data is returned
 });
});

IN home.php
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<form class="form-horizontal" name="apply" id="apply" method="post">
	<div class="form-group">
		<label class="col-xs-3 control-label">Data type</label>
		<div class="col-xs-6">
		<select class="form-control" name="data_type" id="data_type"> 
			<option value="Text_Fields" id="TextFields">Text Fields</option>
			<option value="Address" id="Address">Address</option>
			<option value="Checkbox" id="Checkbox">Checkbox</option>
			<option value="Currency" id="Currency">Currency</option>
		</select>
		</div>
	</div>
	<div class="form-group">
		<label class="col-xs-3 control-label">Field Name</label>
		<div class="col-xs-6">
			<input type="text" class="form-control" name="FieldName" placeholder="Field Name">
		</div>
	</div>
	<div class="show_contain" id="show_contain">
		<div class="form-group">
		<label class="col-xs-3 control-label">Display Label</label>
			<div class="col-xs-6">
				<input type="text" class="form-control" name="DisplayLabel" placeholder="Display Label">
			</div>
		</div>
	</div>
</form>

IN miniresults.php
<?php
class fields
{
	public function showdefault()
	{
		$viewdefault='<div class="form-group"><label class="col-xs-3 control-label">Display Label</label><div class="col-xs-6"><input type="text" class="form-control" name="DisplayLabel" placeholder="Display Label"></div></div><div class="form-group"><label class="col-xs-3 control-label">System Label</label><div class="col-xs-6"><input type="text" class="form-control" name="SystemLabel" placeholder="System Label"></div></div><div class="form-group"><label class="col-xs-3 control-label">Help Text</label><div class="col-xs-6"><input type="text" class="form-control" name="HelpText" placeholder="Help Text"></div></div>';
		return $viewdefault;
	}
	public function get_default_value()
	{
		$set_default_vals='<div class="form-group"><label class="col-xs-3 control-label">Default Value</label><div class="col-xs-6"><input type="text" class="form-control" name="DefaultValue" placeholder="Default Value"></div></div>';
		return $set_default_vals;
	}
	public function get_msize()
	{
		$addr="<div class='form-group'><label class='col-xs-3 control-label'>Max Size</label><div class='col-xs-6'><input type='text' class='form-control' name='MaxSize' placeholder='Max Size' value='255'></div></div>";
		return $addr;
	}
	public function get_range()
	{ 
		$range="<div class='form-group'><label class='col-xs-3 control-label'>Enable Range Search</label><div class='checkbox col-xs-6'><label><input type='checkbox' class='checkbox' name='EnableRangeSearch' value='Yes' /></label></div></div>";
		return $range;
	}
}
//this class for different datatypes
class drop_type extends fields
{
	function show_Text_Fields()
	{
		echo $this->showdefault();
		echo $this->get_default_value();
		echo $this->get_msize();
	}
	function show_Address()
	{
		echo $this->showdefault();
		echo $this->get_default_value();
		echo $this->get_msize();
	}
	function show_Checkbox()
	{
		echo $this->showdefault();
		echo $this->get_default_value();
	}
	function show_Currency()
	{
		echo $this->showdefault();
		echo $this->get_default_value();
		echo $this->get_range();
	}
}
//Object declaration of class drop_type()
$show_drop = new drop_type();

//$_GET['option'] contain `id` of dropdown option
switch($_GET['option']){

//case include name of options in dropdown
    case 'TextFields':
		echo $show_drop->show_text_fields();
        break;
    case 'Address':
		echo $show_drop->show_Address();
        break;
    case 'Checkbox':
        echo $show_drop->show_Checkbox();
        break;
	case 'Currency':
        echo $show_drop->show_Currency();
        break;
	 default:
		//default contain textfields contain
		echo $show_drop->show_text_fields();
        break;
}
?>

如何在选择框

2 个答案: