In Kendo, is it possible to change the configutation options of a Kendo NumericTextBox after it has been created?
I need a field to accept either a currency or a percentage, based on options set elsewhere. For simplicity, the below code shows the basic case of trying to change the placeholder, but I'll need to change the format, min, and max as well.
In my code, the original NumericTextBox is defined by Kendo MVC (but it could be changed to Kendo UI if there's a solution there).
Here is code in my ASP MVC view file:
<span>
#(Html.Kendo().NumericTextBoxFor(m => m.fieldName)
.Min(0)
.Spinners(false)
.Decimals(2)
.Format("c2")
.Placeholder("Enter amount")
.HtmlAttributes(new { #class = "input-amount", id = "kendo_ntb" })
)
</span>
To valiate I am accessing the object for the correct Kendo NumericTextBox, I run the below code (reference - How can I refresh value kendo numerictextbox?). As expected, it changes the value displayed in the field to "$999.00"
$("#kendo_ntb").data("kendoNumericTextBox").value("999");
I can access and change the options object as well; however, there is no change in how the NumericTextBox displays. In the Chrome console, I entered:
$("#kendo_ntb").data("kendoNumericTextBox").options["placeholder"] = "Enter Percentage"
$("#kendo_ntb").data("kendoNumericTextBox").options["placeholder"]
This returns "Enter Percentage" but placeholder displayed in the browser still reads "Enter Amount".
I was trying to following this example (How can I refresh value kendo numerictextbox?).
I tried the solution here with the same result: the options object change, but the browser display does not. No error is returned, but after running the below command, clicking on the form element no longer lets you enter a value.
$("#kendo_ntb").data("kendoNumericTextBox").setOptions({format: "#.#", decimals: 1, placeholder: "change please" });
Related
I am attempting to input the value of a hidden field into a textbox in Testcafe, ideally in some sort of manner that simulates typing. Is there a way to do that? Every time I try to do it via javascript it just throws a javascript error.
Essentially I am testing a pretty standard web app - I fill out a form, go page to page, and then must type in a value that is kept in a hidden html input field on the page. I honestly have no idea where to start - every time I've tried to do this with javascript via the "Run Test Cafe Script" it has thrown a javascript error - I really don't know where to start if javascript can't be used.
TestCafe cannot type text in a zero-size input element. I suggest you try the Run TestCafe Script action with ClientFunction that puts a value to the input element directly:
const setValue = ClientFunction(() => {
document.querySelector('input[type="hidden"]').value = 'John Smith';
});
await setValue();
I have to look at an application which I can't use the normal selectors (like "id", "name", etc - this is a design flaw) but I do have a custom tag which has been applied to elements on the page:
test-tag='x'
and this is fine, I can interact with this using (simple script)
var tag = '[test-tag="x"]';
var selector = $(tag);
However, I have now found that some elements (notably textboxes) have a title and a box element - both have the same custom tag applied. Now the text box is an input type. Anyone know how I can change the above to target specifially input types?
try this:
'input[test-tag="x"]'
for the input box
Take a look at this as well:
https://www.w3schools.com/cssref/css_selectors.asp
I'm super new to html
All I need is the code for a field where a User can type his Staff Number and then a button which takes him to a URL that is made up of his Staff Number somewhere in the path.
Eg:
The User enters '123' in the text field and when clicking the 'Submit' button must be taken to this document:
www.mysite.com/Staff123.pdf
Not sure about the syntax but with an example I would be able to edit to suit what I need if I can get the code to create both the text field as well as the button.
Thanks a lot
You need to create a form in html. Basically, a form is a block which let user input some values (text, password, email, date, integer, file, ...) and that send these values, once submitted through a submit button, to a certain file that will process these datas.
A classic example is the login form that you can see on nearly each site you know.
It could be like that:
<form action="processing_script.php" method="post">
<input type="email" name="user_mail" placeholder="Please enter your mail here">
<input type="password" name="user_password" placeholder="Please enter your password here">
<input type="submit" value="Click here to send the form">
</form>
You can see some attributes used in this example, I will describe each of them:
action attribute for form tag: it's the script that will receive and process the values from this form.
method attribute for form tag: it's the way that values will be sended to the destination script. It can be etheir "post" or "get". The post method will send the values through http headers, so it's hidden for users (but it can be seen with tools like Wireshark). The get method will send values through the adress bar like this (this is the url you see once you submitted the form): http://yourWebsite.com/processing_script.php?user_mail=johndoe#liamg.com&user_password=mYp#$$W0rD
type attribute for form tag: it depends on the type of data you want the user to inquire. Your web browser will use this attribute to determine which way he will show the input to the user. For example, user will see a little calendar widget if you wrote type="date". The browser will also do some basic verification on the data type when the user will click the submit button (in fact, the browser will not let someone validate the form if for example the input type is "email" and the value entered by the user is "zertredfgt#" or "erfthrefbgthre", but it will pass if the mail is "johndoe#liamg.com"). Type can be email, text, date, password, file, submit, and some others.
name attribute for input tag: it's the name of the variable that will be used in the destination script to access to the value entered by user in the field of the form.
placeholder attribute for input tag: it's the text shown in the fields when they're still empty. The text is not in black, it's some kind of grey.
The last thing to explain is the :
it's displayed as a button, and the text on it comes from the value attribute.
In your case, I think you only need to use some JavaScript:
Create a JavaScript method that will redirect you to the right pdf url based on what is entered in a text input.
Create a small form, without action or method fields.
Create an input type text (for the staff number) with a good attribute name like this: name="staffNumber".
Create a button (not a submit button) like this:
To redirect to a specific url in JavaScript, you want to read this: How do I redirect to another webpage?
To read the value from an input in JavaScript, you can proceed like that:
...
var staff_number = getElementsByName("staffNumber")[0].value;
...
To create the full url of the right PDF, just use the concatenation operator (it's + in JavaScript), so something like that should work:
...
var base_url = "http://youWebsite.com/Staff";
var file_extension = ".pdf";
var full_url = base_url + staff_number.toString() + file_extension;
...
(the .toString() is a method that ensure it's processed as a string, to concatenate and avoid some strange addition that could occur I guess)
I think you've got everything you need to create exactly what you need.
Please keep us up to date when you've tried !
I have a dropdown list that serves as a record navigation control -- selecting a value from the dropdown is supposed to "jump to" that record. I feel like I've done stuff like this before that worked, but I can't get this one to work. The issue seems to be that I can't get the dropdown list to change the ID route value that the page was initially called with. So let's say my page is called from this URL:
/PatientProfile/Services/12
12 is the ID route value here--this is essentially the initial record displayed. This works. However, when I select something from my dropdown, it will redirect to something like this:
/PatientProfile/Services/12?ID=7
Notice how the 12 is still there in the route value ID. ID 7 was selected from the dropdown, but it's appended to the URL as a new parameter instead of the route value. What I want to happen is this:
/PatientProfile/Services/7
Here's what the razor looks like for my dropdown:
#using (Html.BeginForm("Services", "PatientProfile", FormMethod.Get))
{
#Html.Label("ID", "View Profile:")
#Html.DropDownListFor(model => model.CurrentProfile.ID, ViewBag.ProfileID as SelectList, new { onchange = "this.form.submit();" })
}
I tried both Html.DropDownList and Html.DropDownListFor, but saw no difference in behavior.
Any help greatly appreciated.
I would use jquery for this. Please confirm the generated id of the dropdownlist for this to work properly
$('#CurrentProfile_ID').change(function(){
window.location('#Url.Action("Services", "PatientProfile", new { id = "----" })'.replace("----", $('#CurrentProfile_ID :selected').val()));
});
Hopefully this helps.
PS. This sounds like a perfect situation for using a partial view that you update using an ajax call so you don't have to post back.
I am working in Ektron 8.6.
I have a FormBlock Server Control in my Template Page,It is having a DefualutFormID of a valid HTML form from workarea.The form in the workarea have got few form fields and their corresponding values.
While the template page is rendering I need to GET those form field values and re-set them with some other values.
In which Page –Cycle event I should do this coding?
I tried this code in Pre-Render Event,but I am unable to GET the value there,but I am able to set a value.
I tried SaveStateComplete event as well,no luck.
String s=FormBlock1.Fields["FirstName"].Value;
If(s=”some text”)
{
// Re-set as some other vale.
FormBlock1.Fields["FirstName"].Value=”Some other value”;
}
In which event I can write this piece of code?
Page_Load works fine for changing the value of a form field. The default behavior is for the Ektron server controls to load their data during Page_Init.
The real problem is how to get the default value. I tried every possible way I could find to get at the data defining an Ektron form (more specifically, a field's default value), and here's what I came up with. I'll admit, this is a bit of a hack, but it works.
var xml = XElement.Parse("<ekForm>" + cmsFormBlock.EkItem.Html + "</ekForm>");
var inputField = xml.Descendants("input").FirstOrDefault(i => i.Attribute("id").Value == "SampleTextField");
string defaultValue = inputField.Attribute("value").Value;
if (defaultValue == "The default value for this field is 42")
{
// do stuff here...
}
My FormBlock server control is defined on the ASPX side, nothing fancy:
<CMS:FormBlock runat="server" ID="cmsFormBlock" DynamicParameter="ekfrm"/>
And, of course, XElement requires the following using statement:
using System.Xml.Linq;
So basically, I wrap the HTML with a single root element so that it becomes valid XML. Ektron is pretty good about requiring content to be XHTML, so this should work. Naturally, this should be tested on a more complicated form before using this in production. I'd also recommend a healthy dose of defensive programming -- null checks, try/catch, etc.
Once it is parsed as XML, you can get the value property of the form field by getting the value attribute. For my sample form that I set up, the following was part of the form's HTML (EkItem.Html):
<input type="text" value="The default value for this field is 42" class="design_textfield" size="24" title="Sample Text Field" ektdesignns_name="SampleTextField" ektdesignns_caption="Sample Text Field" id="SampleTextField" ektdesignns_nodetype="element" name="SampleTextField" />