dla ludzi, którzy zastanawiają się, jak dodać niestandardowy combobox w nicEdit, tu jest mój wpis na blogu, aby wyświetlić niestandardową listę rozwijaną z wartościami dynamicznych
Link
Through Montaż NiceEdit js pliku tylko możemy dodaj niestandardowe pole Combo w NicEdit
Przez Dalej możemy dodać dropdown lub combobox do NicEdit.Można uzyskać wartość rozwijaną z bazy danych poprzez wywołanie ajax i pokazać go w NicEdit Przede wszystkim należy pobrać i wdrożyć NicEdit na aspx strony Pobierz plik na NiceEdit js i można ją włączyć przez następujący kod (http://nicedit.com/)
<div style="height: 700px; width: 70%; overflow: scroll"> <div id="sample"><script type="text/javascript" src="../scripts/nicEdit.js"></script><script src="../nicExample/nicExample.js"></script>
<script type="text/javascript">
bkLib.onDomLoaded(function() {
// nicEditors.allTextAreas()
new nicEditor({ fullPanel: true }).panelInstance('area2');});</script>
<h4>NicEdit Textarea</h4><textarea name="area2" id="area2" style="width: 70%; height: 700px"> </textarea>
</div></div>
teraz dodaj getddlData() funkcji Ajax w pliku niceEdit.js w końcu pliku
// AJAX call
function getddlData() {
var ajaxResponse;
$.ajax({
type: "POST",
url: 'NicEdit.aspx/GetBookMarkData', // AJAX call to fecth dropdown data
contentType: "application/json; charset=utf-8",
dataType: "json",
async: false,
cache: false,
// Text file name
success: function (response) {
// //alert(data.d); // or do some other data processing
// //return data.d;
ajaxResponse = response;
}
});
return ajaxResponse.d;
}
// Dodaj WebMethod w związanym kodzie (plik .cs) do fetech wartość rozwijaną w nicedit
[WebMethod]
public static string GetBookMarkData()
{
///Also you can get DB's data here
/// (2 responses dropdown values being filled : 'drop down Value', drop down Text)
/// Need DB data in , seprated list Formate: @@[email protected]@,TestOne, TestOne, @@[email protected]@,Test2,Test2
string sbookmarkData = "<<Test_Name>>,Test Name,<<Test_Add>>,Test Add,<<Test_Location>>,Test Location,<<Test_City>>,Test City,<<Test_Phone>>,Test Phone";
return sbookmarkData;
}
teraz otwarty NicEdit js pliku i kopiowania (linia nr 1552) lub szukaj następujących linii:
var nicEditorFontFormatSelect = nicEditorSelect.extend({
Copy complete function and create another one by changing names etc
var nicEditorInsertBookmark = nicEditorSelect.extend({
/* By Pankaj Sharma : Not Needed Now */
sel: {
'[[Location]]': "Test Name",
pre: "Test Address",
h6: "Test City",
h5: "Test State",
h4: "Test Zip",
h3: "Test ABC",
h2: "Test One",
},
init: function() {
/* Pankaj Sharma */
this.setDisplay("Insert Bookmark");
var response = getddlData();
var responseArr = response.split(",");
var strings = [];
//for (itm in this.sel) {
// // var A = itm.toUpperCase();
// //this.add( A, this.sel[itm] )
// }
for (i = 0; i < responseArr.length; i++) {
strings.push([responseArr[i], responseArr[i + 1]]);
i = i + 1;
}
for (var i in strings) {
this.add(strings[i][0], strings[i][1]);
}
/* END HERE*/
},
});
Got to linia nr 1230 lub poszukać następującą linię:
var nicSelectOptions = { przyciski: { Dodaj następujący poniżej funkcji fontFormat
'CustomBookmark': { nazwa: __ ('Wstaw zakładkę'), typu: 'nicEditorInsertBookmark', // komenda: 'InsertBookmark' // InsertBookmark }
zaktualizowany funkcja powinna wyglądać następująco
var nicSelectOptions = {
buttons: {
'fontSize': {
name: __('Select Font Size'),
type: 'nicEditorFontSizeSelect',
command: 'fontsize'
},
'fontFamily': {
name: __('Select Font Family'),
type: 'nicEditorFontFamilySelect',
command: 'fontname'
},
'fontFormat': {
name: __('Select Font Format'),
type: 'nicEditorFontFormatSelect',
command: 'formatBlock'
},
'CustomBookmark': {
name: __('Insert Bookmark'),
type: 'nicEditorInsertBookmark', //
command: 'InsertBookmark' //InsertBookmark
}
}
};
Teraz goto linii 1385 lub zmiana: function (A) { go zmienić na
update: function (A) {
// alert(this.options.command);
if (this.options.command == 'InsertBookmark') {+
var editor = nicEditors.findEditor("area2");
var range = editor.getRng();
var editorField = editor.selElm();
editorField.nodeValue = editorField.nodeValue.substring(0, range.startOffset) + A + editorField.nodeValue.substring(range.endOffset, editorField.nodeValue.length);
}
else {
// alert(A);
/* END HERE */
this.ne.nicCommand(this.options.command, A);
}
this.close()
}
W opcjach DropDown kliknij To spowoduje dodanie wartości rozwijanej w edytorze tekstu na pozycji kursora.
END, należy w stanie zobaczyć wyniki
Cześć Klaus, miałem ten sam problem jednak użyłem .html() zamiast .test(), ponieważ funkcja .text() wysyła tylko tekst, a nie formatowanie HTML informacje potrzebne do przechowywania formatowania tekstu. Czy robię to dobrze?? –
To, czego szukałem. Potrzebowałem kodu HTML, a nie niesformatowanego tekstu. Dziękuję za udostępnienie. – Theodoros80