GARANTIR DESCONTO

Fórum Problema com framework Select2 #480039

24/05/2014

0

Olá...

Estou começando agora com desenvolvimento Web...
Toda ajuda é bem vinda!

Estou tendo problemas para mostrar o resultado da pesquisa do combo na pagina!
Meu cenário é:

Back-end JAVA
Front-end HTML + BootStrap + Jquery + Select2 3.4.5

Meu código está assim:
										<div class="row">
											<div class="col-md-12">
												<div class="form-group">
													<label class="control-label" for="departamento">Departamento</label>
													<form:input type="hidden" class="form-control bigdrop select2-select-00 full-width-fix" path="dep_id"></form:input>
												</div>
											</div>
										</div>


[img]http://arquivo.devmedia.com.br/forum/imagem/326242-20140524-162718.png[/img]


Código JavaScript:

$("#dep_id").select2({
			    placeholder: "Buscar um Departamento",
			    minimumInputLength: 1,
			    ajax: {
			        url: "departamento/list.json",
			        dataType: 'json',
			        data: function (term, page) {
			            return {
			            	sSearch: term, // search term
			            	iSortCol_0 :"1",
			            	sSortDir_0:"ASC"
			            };
			        },
			        results: function (data, page) { // parse the results into the format expected by Select2.
			            return {results: data.results};
			        }
			    },
			    initSelection: function(element, callback) {
			        var id=$(element).val();
			            if (id!=="") {
			            $.ajax("departamento/list.json", {
			                    data: {
				                    iSortCol_0: "0",
					                sSortDir_0: "ASC",
					                sSearch: id,
					                iDisplayLength:1
			                    },
			                    dataType: "json"
			                }).done(function(data) {
			                		callback(data.aaData[0]);
			                	});
			            }
			        },
			    dropdownCssClass: "bigdrop",
			    escapeMarkup: function (m) { return m; } // we do not want to escape markup since we are displaying html in results
			});




Meu Json esta vindo assim:

{"more":false,"results":[[1,"Desenvolvimento"]]}


A busca esta funcionando corretamente! porém não esta mostrando o resultado logo abaixa da pesquisa!
Alessandro Folk

Alessandro Folk

Responder

Posts

24/05/2014

Alessandro Folk

Consegui um certo avanço!

Fiz a seguinte alteração:

O Json esta da seguinte forma:
{"results":[{"dep_nome":"Desenvolvimento","dep_id":1}],"more":false}


Meu JavaScript esta assim:
		function dataFormatResult(data) {
	        var markup = "<table class='data-result'><tr>";
	        markup += "<td class='data-info'><div class='data-title'>" + data.dep_nome + "</div>";
	        markup += "</td></tr></table>";
	        return markup;
	    }
	
	    function dataFormatSelection(data) {
	        return data.dep_nome;
	    }


			$("#dep_id").select2({
			    placeholder: "Buscar um Departamento",
			    minimumInputLength: 1,
			    ajax: {
			        url: "departamento/list.json",
			        dataType: 'json',
			        data: function (term, page) {
			            return {
			            	sSearch: term, // search term
			            	iSortCol_0 :"1",
			            	sSortDir_0:"ASC"
			            };
			        },
			        results: function (data, page) { // parse the results into the format expected by Select2.
			            return {results: data.results};
			        }
			    },
			    initSelection: function(element, callback) {
			        var id=$(element).val();
			            if (id!=="") {
			            $.ajax("departamento/list.json", {
			                    data: {
				                    iSortCol_0: "0",
					                sSortDir_0: "ASC",
					                sSearch: id,
					                iDisplayLength:1
			                    },
			                    dataType: "json"
			                }).done(function(data) {
			                		callback(data.aaData[0]);
			                	});
			            }
			    },
		        formatResult: dataFormatResult, // omitted for brevity, see the source of this page
			    formatSelection: dataFormatSelection,  // omitted for brevity, see the source of this page
			    dropdownCssClass: "bigdrop",
			    escapeMarkup: function (m) { return m; } // we do not want to escape markup since we are displaying html in results
			});



O problema agora é que não consigo selecionar o departamento!
Creio que o problema esteja no initSelection...
Responder

Gostei + 0

11/06/2014

Allan Tavares

Alessandro, estou passando exatamente o mesmo problema, solucionou?
não consigo selecionar a opção =(


Consegui um certo avanço!

Fiz a seguinte alteração:

O Json esta da seguinte forma:
{"results":[{"dep_nome":"Desenvolvimento","dep_id":1}],"more":false}


Meu JavaScript esta assim:
		function dataFormatResult(data) {
	        var markup = "<table class='data-result'><tr>";
	        markup += "<td class='data-info'><div class='data-title'>" + data.dep_nome + "</div>";
	        markup += "</td></tr></table>";
	        return markup;
	    }
	
	    function dataFormatSelection(data) {
	        return data.dep_nome;
	    }


			$("#dep_id").select2({
			    placeholder: "Buscar um Departamento",
			    minimumInputLength: 1,
			    ajax: {
			        url: "departamento/list.json",
			        dataType: 'json',
			        data: function (term, page) {
			            return {
			            	sSearch: term, // search term
			            	iSortCol_0 :"1",
			            	sSortDir_0:"ASC"
			            };
			        },
			        results: function (data, page) { // parse the results into the format expected by Select2.
			            return {results: data.results};
			        }
			    },
			    initSelection: function(element, callback) {
			        var id=$(element).val();
			            if (id!=="") {
			            $.ajax("departamento/list.json", {
			                    data: {
				                    iSortCol_0: "0",
					                sSortDir_0: "ASC",
					                sSearch: id,
					                iDisplayLength:1
			                    },
			                    dataType: "json"
			                }).done(function(data) {
			                		callback(data.aaData[0]);
			                	});
			            }
			    },
		        formatResult: dataFormatResult, // omitted for brevity, see the source of this page
			    formatSelection: dataFormatSelection,  // omitted for brevity, see the source of this page
			    dropdownCssClass: "bigdrop",
			    escapeMarkup: function (m) { return m; } // we do not want to escape markup since we are displaying html in results
			});



O problema agora é que não consigo selecionar o departamento!
Creio que o problema esteja no initSelection...
Responder

Gostei + 0

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários, consulte nossa política de privacidade.

Aceitar