rivets icon indicating copy to clipboard operation
rivets copied to clipboard

Magicsuggest integration

Open vincenzocasu opened this issue 8 years ago • 3 comments

Hi! How i can integrate magicsuggest (http://nicolasbize.com/magicsuggest/doc.html) jQuery plugin on dinamyc row tables? No problem To add magicsuggest on adding row. But on deleting row values of input losts their order...

vincenzocasu avatar Nov 30 '16 17:11 vincenzocasu

Here is my code! Help me!

` var rowList = [];

	...
	
	var controller = {
	
		...
		
		addRow: function(e, model){
			
			console.log("ADD ROW");
			
			
			newRow = 0;
			if(model.data.rows.length){
				newRow = (model.data.rows[model.data.rows.length-1].id)+1;
			}
			
			console.log("New id = "+newRow);
			
			model.data.rows.push({ id: newRow, elem: [], value: ""});
			
			rowList[newRow] = $('.ms_lista_row_'+newRow).magicSuggest({
				name: 'row_'+newRow,
				typeDelay: 10,
				method: 'post',
				maxSelection: 1,
				data: agency_global.ajax_url,
				dataUrlParams: { action: "get_list_elem" },
				displayField: 'text',
				valueField: 'value',
				allowFreeEntries: true,
				allowDuplicates: false,
				placeholder: 'Write and search',
				selectionRenderer: function(data){
					return data.text + ' (<b>' + data.value + '</b>)';
				},
				ajaxConfig: {
					xhrFields: {
					  withCredentials: true,
					}
				},
				noSuggestionText: '<span style="color:red; font-weight:bold;">No suggest!</span>',
				maxSelectionRenderer: function(v) {
					return '';
				}
			});
			
			$(rowList[newRow]).on('selectionchange', function(e, m, r){
				model.data.rows[newRow].elem = r;
				console.log("Change ROW input Element");
			});
			
		},
		
		deleteRow: function(e, model){
		
			console.log("DEL ROW "+model.selectedRow.id);
		
			var delete_index;
		
			model.data.rows.forEach(function(item, index){
				
				console.log("ROW "+index);
				
				if(item.id == model.selectedRow.id){
					console.log("item = "+item.id+" SELECTED ROW = "+model.selectedRow.id+" index = "+index);
					delete_index = index;
				}
				
			});
			
			model.data.rows.splice(delete_index, 1);
			
			// update row ids
			var i=0;
			model.Polizza.compagnie.c.forEach(function(item, index){
				item.id = i;
				i++;
			});
			
			// Update magicSuggest values
			rowList.forEach(function(item, index){
				
				item.setSelection(model.data.rows[index].compagnia);
				
				$(item).on('selectionchange', function(e, m, r){
					model.data.rows[index].elem = r;
					console.log("Change ROW input Element");
				});
				
			});
			
		}
	
	}`

On adding row it's all ok! But when i remove row, current row is deleted, but all magic suggest values are wrong! Where is the error?

vincenzocasu avatar Dec 01 '16 09:12 vincenzocasu

Where are you using rivets? I working fiddle would help.

blikblum avatar Dec 01 '16 10:12 blikblum

If you are using rv-each you may hit this know bug: https://github.com/mikeric/rivets/issues/515

blikblum avatar Dec 01 '16 10:12 blikblum