Way to grab what you see in Dojo Number TextBox - javascript

I'm wondering why for some widgets such as the currency widget when I perform a dojo.byId to get a value of the textbox, I get back the formatted value meaning I get back something like this: "$44.3" with the dollar sign.
However when I created a custom percent textbox, and it inherits from the NumberTextbox (as so does the currency textbox widget), for some reason doing a dojo.byId returns me the value without the % even though I see there is a % in the textbox.
I'm trying to unit test this stuff and for some reason, for the currency control I was able to do something like this:
var formatedValue = dojo.byId("currencyTextBox").value;
doh.t(formatedValue === "$46.93", "incorrect formatting");
which when I check formattedValue it gave me "$46.93".
However when I tried this same type of deal with my percent textbox, if I see for example "55%" in the textbox, this will return 55, not "55%":
var formatedValue = dojo.byId("percentTextBox").value;
doh.t(formatedValue === "93%", "incorrect formatting");
so I don't understand why the behavior would act differently in terms of it picking up the textbox value using dojo.byId. (Obviously if I were to do a widgetInstance.get("value"); I'd expect only a whole number to come back, the raw number without the formatting.)

Related

Is there a way to distinguish selecting from a datalist vs typing the same string manually?

As far as I can tell there isn't, but I figured I'd ask.
I have a text input. Autocomplete suggestions are fetched dynamically as you type and fill a datalist attached to the input. Normally, typing something and pressing the "search" button brings up a table of search results to select from.
Since the datalist is basically the exact same thing, but simplified, and selecting an option from it is unambiguous, I'd like it to just carry on with my selection handlers without having to bring up the list for selection a second time. When the person manually types something though, I still want them to explicitly pick from the list, especially since some options may be substrings of the others, so I don't want it to auto-select a result for you if it matches halfway through.
I ended up not reimplementing it like ControlAltDel suggested in his comment and instead went with the following slightly hacky but functional solution:
Since I am refetching the search results as you type, if only 1 search result is returned (ie. it's unambiguous) and the current string is a case-insensitive exact match to that result, then select it. It works well for what I need it for, but I could imagine this not working for everyone.
The JS is roughly as follows:
if (searchResults.length === 1
&& searchString.toLowerCase() === searchResults[0].toLowerCase()
) {
selectResult(searchResults[0]);
}
I'm calling this in my handler for when the search results list changes, not the input's handler, since the results are only re-fetched after the input has already been changed.

getting empty field value with JavaScript in FormAssembly calculated field

I'm pretty inexperienced with JavaScript, but I'm trying to do something that seems like it should be simple. I have a text input field (FieldA) in a FormAssembly form. I have another text input field that’s a calculated field (FieldB), and I want FieldB to return one value if FieldA is empty and a different value if FieldA is not empty. The formula I’m using in “Enter the calculation” looks like this:
if(FieldA==""){"empty"}else{"not empty");
When I go to the form, the result is “error” in FieldB, and adding a value to FieldA has no effect. When I do it in Preview mode, I get the additional message “There was an error computing this field.” FieldA here is tfa_40, but it seems to make no difference whether I use tfa_40 or define it as a variable and use the variable name. It also doesn’t seem to matter whether I use double quotes, null, or 0. Am I taking the wrong approach here? Is this even possible?

dijit.byId('viewEditParameterValue').value does not return while .get('value') does

I have defined two Text input in my html like this..
<revit:validationTextBox id="viewEditParameterValue" maxLength="2500"
required="true"
invalidMessage="#{commonuielements.msg_invalid_input}">
</revit:validationTextBox>
<revit:validationTextBox id="viewEditParameterValDefault"
maxLength="100"
regExp="#{commonuielements.parameter_default_value_regex}"
invalidMessage="#{commonuielements.msg_invalid_input}"
trim="true"></revit:validationTextBox>
I am trying to get the value of two TextBox in a java script function like this..
var value = dijit.byId('viewEditParameterValDefault').value;
var parValue = dijit.byId('viewEditParameterValue').value;
But for the first one I get the value but second line returns blank whereas If I use below line I get the value.
var parValue = dijit.byId('viewEditParameterValue').get('value');
Does anybody have any guess what could be the reason?
get('value') is the correct way to retrieve the value of a Dijit form input widget. Accessing value directly isn't guaranteed to give you consistent results (or the results you expect), since it will be implementation-dependent. This is perhaps even more important for certain subclasses of TextBox where formatting or mapping come into play.
Moreover, setting value directly won't accomplish anything, whereas calling set('value', ...) will properly update the widget.

Linking mvc razor checkbox to razor textbox

tl;dr I want to save the value of a textbox to the model ONLY IF the checkbox is checked.
First off, I know my code is very messy. I've been trying to improvise my code off of another stack overflow question so it is first and foremost wrong. What I am trying to do is I have these restrictions to an event, some are bool and some are numbers. For example, no smoking is a bool, but minimum age is a number. These are optional though, the user doesn't have to set any. So I want to have a checkbox saying that they want the restriction but to also save the value to the model. Here is what I have so far:
<p>
<input type="checkbox" id="ageLowCapCB"
#(((Model.currentRestrictions.AgeLowCap != null) &&
(Model.currentRestrictions.AgeLowCap != 0)) ? "checked = 'checked'" : "")
/>
Low Age Limit
#Html.TextBoxFor(e => e.currentRestrictions.AgeLowCap, new {id = "ageLowCap"})
</p>
and the script/jquery for this I have is:
$("#ageLowCapCB").click(function () {
var isChecked = $(this).is(":checked");
$("#ageLowCap").val(isChecked ? /*I don't know what to put here*/);
});
The question I pulled this from was using values of "T" or "F" for true and false so it was easy for them to fill in the comment section putting "T" : "F" and that was it. But I need to pull the value of the text box and set it to the value of Model.currentRestrictions.AgeLowCap. Does anyone have any good ideas on what to do in a weird situation like this?
Unfortunately, there is on way of passing your javascript values to c# view model. However there is some workarounds. You can create action which will accept whatever you want to pass from javascript to c# and then when you need to pass that value(s), that can be done by making ajax request to that action and in that action you can persist that value(s). From there you have many options like in database, session and etc.
Question is not very clear to my understanding. What I understand is if Checkbox is checked display textbox which accepts integer value. All these are model fields.
Approach 1: Write a JavaScript function to detect if Checkbox checked attr is true, Display textbox to accept input from user; Write function for textbox to accept only integers. Onkeypress you can call that function.
Approach 2: If you do not have to take integer value from user in textbox, then on post validate if checkbox is checked and assign value to integer textbox if it is true.
-Thanks

jQuery function to control what user types in a textfield

My initial idea was something like that:
$(document).on("element","event", function(e){
});
But I have some doubts about this function:
which value I should use for "element"? I could use something like this: 'input[type=text]' or I should use a class for the element (like class="validate") and use ".validate" for instance)
which value I should use for "event"? I could use onfocus from element input, or do jQuery have a particular nomenclature for this type of event?
for each key presses (which seems I should use var key = which to capture), how I could check if it's a number or a letter?
using the regex string, how I could get the type of the character in a specific position? for instance, with the regex: [0-9]{2}/[A-Z]{2}/[0-9]{4}, the position 2 should return 'number' as type, the position 3 should return letter, and the position 2 should return 'symbol'.
Anyone can give me some help here?
UPDATE
Let me try be more clear about my question:
I initially think about create this jquery function in my project:
$(document).on("element","event", function(e){
//
});
But I have no idea how "event" I should listener here (I could use the same events available for the input atribute from html?) and like to know what name use for element (I ever use the ID or class from element, and jquery examples always use on of them, but how I could use the own element name, like input - I see once this being used: input[name=something], can I use this too: input[type=text]?).
In relation to the content of the function, I imagine this pseudo-code:
1- tam = size of string (calculated based on regex - already have a function to d this).
2- model[] = array of characteres with 'tam' elements (ok to me, too).
3- initialize counter=0.
4- for each key pressed by user:
4.1- type = store the type of the character in the position 'counter' of 'model[]' - I think I can use the regex to do this, but I don't know how.
4.2- if the character has same type from 'type' variable, store it in model[counter] and increment counter.
So, basicly, my question is find a way of, given a regex, find what type of character should be in each position (I explain that with example in the item 4 above).
There are many ways in which you can restrict/validate what your users type in the input fields.
Method 1
You can use input masking, a great way to improve data validation in forms. Masking allows you to only accept data in a certain format, type. Have a look at this - https://github.com/RobinHerbots/jquery.inputmask
Masking Demo - http://robinherbots.github.io/jquery.inputmask/
This also accepts regex as you need, can be implemented using the library something like this -
<input id="example2" data-inputmask-regex="[a-za-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+)*#(?:[a-zA-Z0-9](?:[a-zA-Z0-9-]*[a-zA-Z0-9])?\.)+[a-zA-Z0-9](?:[a-zA-Z0-9-]*[a-zA-Z0-9])?" />
REGEX WORKING DEMO - http://codepen.io/nitishdhar/pen/Clzem
Note - This method actually restricts the user from typing or entering anything that does not comply to your given pattern in the mask.
Method 2
You can use different input types to control the input eg. text, email, password, number etc.
Ref - https://developer.mozilla.org/en/docs/Web/HTML/Element/Input
Note - This method just defines the type of input control that will be rendered, whether password type or a number type. Helps browsers accept data in those formats.

Categories