How to programmatically open dojox mobile combobox - mobile

I'm using a dojox/mobile/ComboBox widget and would like to programmatically open it.
Tried to use require("dijit/registry").byId("").openDropDown();
but the source comment says... "To be called only when this.dropDown has been created and is ready to display (that is, its data is loaded).", which it doesn't seem to be :(
Calling the _onClick doesn't help either.
Any assistance would be highly appreciated.
Guy

I had the same issue as you.
The dojox.mobile.ComboBox was causing the android keyboard to display.
My work around was to create the combobox programmatically like this:
var myCombo = new ComboBox({
store: registry.byId('your data list'),
value: ''
},"theDomInput");
myCombo.startup();
then in my index.html I had a field with the readonly set like this:
<input id="theDomInput" type="text" readonly/>
The startup function needs to be called before the click event of the combobox.
This works for me. Let me know if you come up with something better.

Related

Disable selection in text input

Basic problem is, when user tabs in a specific text input on a form, prefilled "+36" gets selected. I'd like to somehow put the cursor right after it (after the +36), instead of selecting the whole word. I've been thinking about disabling text selection of text inputs but no result yet. Googled a lot for it but couldnt find anything but disabling text selection on web pages, which is not really related. How could I solve this problem?
If you are using Jquery, you can try something like this on document ready
$(document).ready(function() {
$("input").focus(function() {
var input = this;
setTimeout(function() {
input.selectionStart = input.selectionEnd;
}, 1);
});
});
Please find the Jsfiddle for the same Jsfiddle Input Focus
In your form element put autocomplete attribute like below
<form method="post" action="/form" autocomplete="off">
</form>

Add input in Angular bootstrap confirm module

I am trying to use Angular Bootstrap Confirm by Matt.
In his demo (click here), it is mentioned that html can be used in the message. His code:
Are you really <b>sure</b> you want to do this?
I changed that to
Are you really <b>sure</b><br> you want to do this?
and it still worked. But if I try to add any complex element like input or button, it does not work.
Enter <b>Yes</b><br> <input type='text'> <br>and click 'Yes'
Is there a way to add input or textarea to the message?
You would have to fork their code, based on the source, it is using a class, so you could not do this through the interface.
https://github.com/mattlewis92/angular-bootstrap-confirm/blob/master/src/angular-bootstrap-confirm.html

Update Material Lite checkbox with Angular 2

I am trying to use Material Design Lite in Angular 2 and have trouble updating checkboxes after the state has changed. See the following Plunker example.
When the user clicks on "All" to select all boxes, only the normal checkboxes update. I have tried using componentHandler.upgradeDom() and componentHandler.upgradeAllRegistered() but it made no difference.
How can I get the data-binding to work?
Ok, so I had a similar problem like you, and after good 2 or 3 hours of Googling around, I came up with a solution (or maybe it's just a dirty hack, don't know):
<label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" [class.is-checked]="isChecked()">
<input type="checkbox" [(ngModel)]="checkbox.Checked" class="mdl-checkbox__input">
<span class="mdl-checkbox__label">A label</span>
</label>
I've updated the plunk you've shared so you can see it there. I hope this solves your problem, as it have solved mine.
After reading the MDL code, it seemed to me that the appearance of the MDL checkbox only changes when it sees the onchange event. But just setting "checked" in code doesn't deliver the changed event. So, after I set it, I give it a poke.
function setChecked(element, bool) {
element.checked = bool;
var evt = document.createEvent("HTMLEvents");
evt.initEvent("change", false, true);
element.dispatchEvent(evt);
}
Now, I'm not saying this is the RIGHT or BEST way to do this, but it works for me.

ComboBox.FindControl("TextBox") returning NULL in IE11 but working on IE9

This is an unanswered question in some blogs... `
<< Please Click Here To This Unanswered Question In Other Blogs..>>
will greatfull if can..
am trying to retrive Combobox selected item into a TextBox..here is my code..
using AjaxControlToolKit.dll version - 4.5.7.1002 for ComboBox.
i need to run this code on IE11 for sure.
Please help me in getting solution.
~ Udai
For the difference in html mentioned in reference,you need to access your control using clientId, on of the ways is:-
var TextBoxXXXID = <%=textBoxXXXID .ClientID%>
var control= document.getElementById(TextBoxXXXID);
About the issue this can be because of browser compatibility issue, you would like to add meta tag and add app_brower folder specified in the link .
IN IE 11, use this code to find user input in the textbox in the AjaxComboBox.
It is working in Chrome as well.
ASPX -
<ajaxToolkit:ComboBox ID="cboMetric" runat="server"></ajaxToolkit:ComboBox>
Code behind -
TextBox textBox = cboMetric.FindControl("cboMetric_TextBox") as TextBox;
strMetric = textBox.Text;

Set Default Value to a Combo box, when data is taken from a Store

In Dojo I want to set the first/top option of may Store as the default/displaying option/text of the combo box. I went through the documentation to found no help. if anyone have done that before please share your opinion.
Ps - I can't use ID or name of the option to set it. I want to display what ever the data item somes first in the store to display.
Thanks in advance.
and this is how my combo-box looks like
var Selectbox = new dijit.form.ComboBox({
id: "box1",
disabled:true,
uppercase:true,
autoComplete:false,
trim:true,
value: "boxvalue",
store:detailDataStore,
style:"width:120px; color:black;"
}).placeAt(topContentPane10.containerNode);
There isn't a magic property to set the combobox default selection from a store, you'll have to set it manually.
Something like this:
box.set('value',store.data[0].value)
See this fiddle: http://jsfiddle.net/Gkbpb/1/

Resources