htmlとJavascriptでComboBoxを作成しようとしています。だから私はこのリンクでアイデアを始める必要があります。 MultiSelect Combo(MultiSelect ComboBox)Javascriptから動的コンポーネントを作成する方法
このリンクでは、私はすべてのリソースを取り、私のローカルに配置し、希望の結果を得ました。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Custom Format in ComboBox - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="CSS/easyui.css">
<script type="text/javascript" src="JS/jquery.min.js"></script>
<script type="text/javascript" src="JS/jquery.easyui.min.js"></script>
</head>
<body>
<h2>Custom Format in ComboBox</h2>
<p>This sample shows how to custom the format of list item.</p>
<div style="margin:20px 0"></div>
<div style="margin-bottom:20px">
<input class="easyui-combobox" name="language" style="width:26%;" data-options="
url: 'JSON/combobox_data1.json',
method: 'get',
valueField: 'id',
textField: 'text',
panelWidth: 350,
multiple:true,
formatter: formatItem,
label: 'Language:',
labelPosition: 'top'
">
</div>
<script type="text/javascript">
function formatItem(row){
var s = '<span style="font-weight:bold">' + row.text + '</span><br/>' +
'<span style="color:#888">' + row.desc + '</span>';
return s;
}
</script>
</body>
</html>
私はInputboxをDynamicにしたいので、divやその他の必須属性を渡すことで、どこでも何度でも使用できます。
私はここにしようとしたことは、私が直面しています何chalanges UTは
- ないことである
index.htmlを<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Custom Format in ComboBox - jQuery EasyUI Demo</title> <link rel="stylesheet" type="text/css" href="CSS/easyui.css"> <script type="text/javascript" src="JS/jquery.min.js"></script> <script type="text/javascript" src="JS/jquery.easyui.min.js"></script> <script type="text/javascript" src="JS/NewCombo.js"></script> </head> <body> <h2>Custom Format in ComboBox</h2> <p>This sample shows how to custom the format of list item.</p> <div style="margin:20px 0"></div> <script type="text/javascript"> var myCombo = new NewCombo({ url: 'JSON/combobox_data1.json', method: 'get', valueField: 'id', textField: 'text', panelWidth: 350, multiple:true, //formatter: formatItem, label: 'Language:', }); </script> </body> </html>
で、JSコードが のJsコード
NewCombo = function(args){ var mydiv = "<div style="margin-bottom:20px">"+" <input class="easyui-combobox" name="language" style="width:26%;" data-options=" url: 'JSON/combobox_data1.json',\ method: 'get',\ valueField: 'id',\ textField: 'text',\ panelWidth: 350,\ multiple:true,\ formatter: formatItem,\ label: 'Language:',\ labelPosition: 'top'\ ">"+" </div>" }
ですエラーの原因となる正しい入力タグ要素を作成します。ここで
例:最初のケースで
:
inputタグは、第二ケースinputタグで
"<input class="easyui-combobox" name="language" style="width:100%;" data-options="url: "JSON/combobox_data1.json",method: "get",valueField: "id",textField: "text", panelWidth: 350,multiple:true,label: "Language:",labelPosition: "top">"
です:
"<div id="chart_line" style="width:26%; background-color: lightblue;"><input class="easyui-combobox" name="language" style="width:100%;" data-options=" url: " json="" combobox_data1.json",="" method:="" "get",="" valuefield:="" "id",="" textfield:="" "text",="" panelwidth:="" 350,="" multiple:true,="" label:="" "language:",="" labelposition:="" "top"=""></div>"
は今どのように私を助けてくださいこれを修正する。
スクリプトで重要である$( "#divIdは")とdiv要素のidにHTMLを追加するためのオプションを持っています。HTML( "") – Profstyle
私のJSコードでは? – David
はい、最初にインポートしないと、jqueryライブラリをインポートする必要があります。 – Profstyle