0

i've to work with phonegap build, cli 5.x and try to build a search form with several inputs, 3 of them are select boxes.

all works fine till i wanted to set the css of the select nodes to 100% with. If i enable this css the selection does not open any more.

My Android Device for testing that won't work is a Nexus 7 with Android 5.1.1 (Lollipop). On IOS and Android Devices with 4.x all is working fine.

The language we use is Typescript with JQuery and will be compiled to Javascript ES5 (commonJS Style).

Sample Script:

var sampleData = [{"val": 1, "text": "sample A"}, {"val": 2, "text": "sample B"}];

var myContainer $('#content-box');

var selectBox = $('<select>').attr('id', 'mySelectBox');
selectBox.append($('<option>').attr('value', 'none').html('-- none --'));

for(var index in sampleData) {
  var obj = sampleData[index];
  selectBox.append($('<option>').attr('value', obj['val']).html(obj['text']));
}

// code above works fine

$('select').css('width', '100%'); 
// this crashes the popup after compilation
// and i have to use phonegap-build

by the way, if i have extreme long content going over 100% of the screen with it works. just stretching seems to crash.

i don't work with jquery mobile, some features we build won't work with it !!!

tried external css also, same failure.

somebody has a workaround or a fix for it? somebody can confirm this solution?

mtizziani
  • 956
  • 10
  • 23

1 Answers1

0

Try setting an id for the element you want to modify,

then try

$('#select').css('width', '100%');

if id="select"

Hoon
  • 637
  • 5
  • 10
  • does have the same effect, clicking on the select does not open the pulldown / popup if a with is set. looks like you dont know what ```$('select')``` does. it return a array of all select-tagged elemets found in the document. – mtizziani Jun 23 '16 at 06:46
  • You are right, $('select') returns an array but that doesn't mean that all related elements can be influenced. Depends on how to use it, only 0 index can get affected. So, what I trying to say was to specify what you needed to change and set and id for it (or let's say inefficient but more accurate way). Sorry couldn't help you much but your example code is magical and couldn't take a good guess. – Hoon Jun 23 '16 at 19:24
  • after long time of inactivity in the project i found how to make it: `$('select').each(function(){$(this).css('width', '100%');})` – mtizziani Mar 08 '17 at 16:54