twitter bootstrap - Select2 v4 in jqGrid edit modal window issue -


i know issue jqueryui modal window , select2. i'm using fix https://github.com/select2/select2/issues/1246#issuecomment-71710835. i'm trying integrate select2 jqgrid , edit modal window , noticed input field loosing focus on keydown , no text entered. i'm using latest build of select2 v4.0.0.

  1. clicked on select2 - list opened , input has focus
  2. started search text (keydown) - input looses focus , no text appears
  3. strange, on same modal window, when select2 multiple type, it's working fine
  4. select2 created on jqgrid datainit event:

datainit: function (elem) {  $(elem).css({ width: "500px" }).select2({  	data: stacjedlaidzampoc,  	allowclear: false,  	tags: false,  	minimuminputlength: 0,  	placeholder: "wskaż stację",  	templateresult: function (repo) {  		if (repo.loading) {  			return repo.text;  		}  		return $(repo.text2);  	},  	templateselection: function (repo) {  		return $(repo.text2);  	},  	minimumresultsforsearch: 5  }).on("select2:select", function(event) {  	var lwystapien = parseint(event.params.data.lwystapien);  	$("#wystapienie").val(1);  	$("#lwystapien").val(lwystapien);  	if (lwystapien > 1) {  		$("#wystapienie").prop("disabled", false).spinner("enable");  	} else {  		$("#wystapienie").prop("disabled", true).spinner("disable");  	}  });  }

as wrote above i've tried fix jqueryui modal:

if ($.ui && $.ui.dialog && $.ui.dialog.prototype._allowinteraction) {      var ui_dialog_interaction = $.ui.dialog.prototype._allowinteraction;      $.ui.dialog.prototype._allowinteraction = function(e) {  	    console.log(e);          if ($( e.target ).closest('.select2-dropdown').length) { return true; }          return ui_dialog_interaction.apply(this, arguments);      };  };

but not working on jqgrid modals.

it seems work select2 full biuld , attachcontainer i've noticed problems oveflow: hidden :-(

i posted answer on the issue already, because more people read steckoverflow repeat here main information.

jqgrid uses jqmodal.js module default form editing. modal jqmodal.js register keypress keydown mousedown event handler on document element (see here) can block pressed key , set focus on first visible input element of edit form (see the line). 1 can solves problem 2 ways. simple way 

$.fn.jqm = false;

which prevent usage of jqmodal.js module. if 1 included jquery ui js file jqgrid use jquery ui modal in case. it's simple way solve problem.

alternatively 1 can add class jqmid1 (or jqmid appended index) container of select2. 1 can find corresponding code example in the comment. demo works in google chrome @ least. demonstrates reason of strange behavior of select2 inside of form editing. recommended way use jquery ui modal or don't use modal: true option.

updated: thought problem , have found better solution. remind me 1 had close problem processing of mouse events in jqmodal.js , posted fix many years ago included in old version of jqgrid. fix consist testing absolute position of mouse cursor , if inside of area of modal dialog mouse event allowed.

so had idea modify jqmodal.js making close tests keyboard events too. posted corresponding changes free jqgrid (see here) , select2 have no problems. see http://jsfiddle.net/191no21j/13/.


-

Comments

Post a Comment

Popular posts from this blog

apache - PHP Soap issue while content length is larger -

we have developed soap based webservice post data third party webservice. accepts 4 params. in 1 of parameters accepts xml string no size limit restriction put in place. the webservice works fine in local environment running on php 5.2 , apache2. works content length long 10 mb. in staging server running nginx , php fpm.we have updated max post size , max upload filesize in php.ini , client_max_body param in nginx.conf allow upto 50 mb. but webservice client keeps on loading in staging environment. gives 502 timeout , gives soap error. can me understand issue here?
Read more

asynchronous - Python asyncio task got bad yield -

i confused how play around asyncio module in python 3.4. have searching api search engine, , want each search request run either parallel, or asynchronously, don't have wait 1 search finish start another. here high-level searching api build objects raw search results. search engine using kind of asyncio mechanism, won't bother that. # no asyncio module used here class search(object): ... self.s = some_search_engine() ... def searching(self, *args, **kwargs): ret = {} # raw searching according args , kwargs , build wrapped results ... return ret to try async requests, wrote following test case test how can interact stuff asyncio module. # here testing script @asyncio.coroutine def handle(f, *args, **kwargs): r = yield f(*args, **kwargs) return r s = search() loop = asyncio.get_event_loop() loop.run_until_complete(handle(s.searching, arg1, arg2, ...)) loop.close() by running pytest, return runtimeerror: task got bad yield : {results s...
Read more

javascript - Complete OpenIDConnect auth when requesting via Ajax -

the normal openidconnect server works like: you go a.com/secure-resource you 302 server your browser handles , sends identity server you login there it sends a.com via post you logged in on a.com , a.com/secure-resource on browser. however have scenario i'm trying solve need help. the user logged in on idserver the user logged in on a.com the user not logged in on b.com we need send ajax call web server b.com (from domain a.com ) b.com configured use openidconnect. but because request b.com via ajax, user cannot redirected idserver. (all in response 302 ) we can go ahead , handle 302 via ajax (i'm still not sure whether work, security-wise). but is there scenario in identityserver/openidconnect designed these situations? with identityserver in scenario setup server b.com use bearer token authentication, need use access token provided a.com in headers of ajax call $.ajax({ url: 'http://b.com', headers: { ...
Read more