資訊專欄INFORMATION COLUMN
摘要：上一篇輸入提示接著上一篇的功能，繼續(xù)，還是那個。修改插件源碼后，再次初始化設(shè)置和，代碼如下請輸入課程名稱沒有相關(guān)信息搜索中然后獲取到了和的值，效果如下圖所示
上一篇：JQuery tokeninput 輸入提示 https://segmentfault.com/a/11...
接著上一篇的功能，繼續(xù)，還是那個html、js。
獲取tokeninput中的數(shù)據(jù)，官網(wǎng)方法如下：
Methods
selector.tokenInput("get");
Gets the array of selected tokens from the tokeninput (each item being an object of the kind {id: x, name: y}).
恕在下才疏學淺，英文實在不會翻譯 -_-|||
具體使用，js代碼如下：
function addBookSetting(){
var courseId = $("#token-courseId").tokenInput("get");
$.each(courseId,function(i,item){
$("#add-course").val(item.id);
});
var bookIds = []
var bookId = $("#token-bookId").tokenInput("get");
$.each( bookId,function(i,item){
bookIds.push(item.id);
});
$("#add-bookId").val(bookIds);
if($("#token-input-token-courseId").parent("li").prev().html()!=null&&
$("#token-input-token-bookId").parent("li").prev().html()!=null){
var data = $("#book-setting-add-form").serialize();
var url = "/server/course/book/add.json";
$.getJSON(url,data,function(rtn){
//做你想做的一些頁面操作
//例如：
alert("添加成功");//彈出添加成功
$("#modal-book-setting-add").modal("hide");//添加框消失
book_setting_list(0);//頁面列表刷新
});
}if($("#token-input-token-courseId").parent("li").prev().html()==null){
alert("課程名稱不能為空");
}if($("#token-input-token-bookId").parent("li").prev().html()==null){
alert("教材名稱不能為空");
}
}
補充:
最近用到tokenInput("get")要獲取json中的另外的數(shù)據(jù)例如courseId和courseName，而tokenInput("get")默認獲取的時json中的id和name,在初始化tokenInput時可通過設(shè)置tokenValue:"courseId"和propertyToSearch:"courseName"改變tokenInput("get")獲取到的object,但是設(shè)置后發(fā)現(xiàn)，可以獲取到是id和courseName卻仍然不能獲取到courseId。
通過Support for use of custom "tokenValue" field 這篇文章，修改了jquery.tokeninput.js插件源碼后，才使得設(shè)置tokenValue支持用戶自定義的值。修改插件源碼后，再次初始化tokenInput設(shè)置tokenValue:"courseId"和propertyToSearch:"courseName"，代碼如下：
$("#token-course").tokenInput("/course/list.json?classId="+classId+"&termId="+termId,{
tokenValue: "courseId",
theme: "facebook",
hintText: "請輸入課程名稱",
noResultsText: "沒有相關(guān)信息",
searchingText: "搜索中...",
preventDuplicates: true,
propertyToSearch : "courseName",
queryParam: "courseNameLike",
});
然后tokenInput("get")獲取到了courseId和courseName`的值，效果如下圖所示：
tokenValue
The value of the token input when the input is submitted. Set it to id in order to get a concatenation of token IDs, or to name in order to get a concatenation of names. default: idpropertyToSearch
The javascript/json object attribute to search. default: “name” (demo).
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/79199.html
摘要：好多編輯器例如等都支持這樣的語法來快速的編寫代碼如何優(yōu)雅地使用把標簽放在結(jié)束標簽之后結(jié)束標簽之前的差別什么是響應式設(shè)計怎樣進行 書籍 《JavaScriptDOM編程藝術(shù)》《JavaScript高級程序設(shè)計》《JavaScript框架設(shè)計》《JavaScript專家編程》《JavaScript Ninjia》《JavaScript語言精粹（修訂版）》《JavaScript設(shè)計模式》《J...
摘要：好多編輯器例如等都支持這樣的語法來快速的編寫代碼如何優(yōu)雅地使用把標簽放在結(jié)束標簽之后結(jié)束標簽之前的差別什么是響應式設(shè)計怎樣進行 書籍 《JavaScriptDOM編程藝術(shù)》《JavaScript高級程序設(shè)計》《JavaScript框架設(shè)計》《JavaScript專家編程》《JavaScript Ninjia》《JavaScript語言精粹（修訂版）》《JavaScript設(shè)計模式》《J...
摘要：好多編輯器例如等都支持這樣的語法來快速的編寫代碼如何優(yōu)雅地使用把標簽放在結(jié)束標簽之后結(jié)束標簽之前的差別什么是響應式設(shè)計怎樣進行 書籍 《JavaScriptDOM編程藝術(shù)》《JavaScript高級程序設(shè)計》《JavaScript框架設(shè)計》《JavaScript專家編程》《JavaScript Ninjia》《JavaScript語言精粹（修訂版）》《JavaScript設(shè)計模式》《J...
摘要：簡介簡介輸入提示自動完成插件，類似搜索的自動完成的功能，例如，撰寫文章提問時添加標簽的時候下拉框自動的提示。官網(wǎng)使用下載文件在官網(wǎng)下載相關(guān)的文件將這些文件放入項目中，本人習慣性放入項目的目錄下。 簡介 簡介：輸入提示自動完成插件，類似google搜索的自動完成的功能，例如，segmentfault撰寫文章、提問時添加標簽的時候下拉框自動的提示。官網(wǎng)：http://loopj.com/j...
摘要：轉(zhuǎn)載來源包管理器管理著庫，并提供讀取和打包它們的工具。能構(gòu)建更好應用的客戶端包管理器。一個整合和的最佳思想，使開發(fā)者能快速方便地組織和編寫前端代碼的下一代包管理器。很棒的組件集合。隱秘地使用和用戶數(shù)據(jù)。 轉(zhuǎn)載來源：https://github.com/jobbole/aw... 包管理器管理著 javascript 庫，并提供讀取和打包它們的工具。?npm – npm 是 javasc...
閱讀 3265·2023-04-26 01:31
閱讀 1904·2023-04-25 22:08
閱讀 3456·2021-09-01 11:42
閱讀 2833·2019-08-30 12:58
閱讀 2176·2019-08-29 18:31
閱讀 2440·2019-08-29 17:18
閱讀 3071·2019-08-29 13:01
閱讀 2559·2019-08-28 18:22
