I'm building a form using React and Material UI. I'm supposed to add a helper, when the user is starts typing in the Text input field. What is property which I could use ? The helper should not be displayed when moved to next text input field
If you want to have that on a Textfield there is a helperText prop that you can use to show some information useful information to the user. Take a look at the docs and give it a shot.
You can use the input value to know if the user has typed something and show this helperText conditionally, I'm not sure if I understood what you wanted but I'm guessing it goes this way.
I've added here a sample of a helperText showing only when the user is typing https://codesandbox.io/s/material-demo-supmg?fontsize=14
Related
I am working on customJs for swagger.
There I want to fill out an input field in advance for my use case.
Basically I can't see the code attached to the input field generated by swagger, but I can fill the input field with inputElement.setAttribute('value',"some stuff" )
But this does not trigger function as it seems, because when I proceed to use the submit button, it says the field is empty, only after I MANUALLY typed a letter and removed it, it recognized my changes.
Can I somehow trigger whatever the underlying function might be?
I was wondering if there is a way to fill the input fields having type text and have inbuilt js event to evaluate what is being entered means, when a user types in any number it evaluates and checks the type of card and also put automatic spaces in between. But while setting the value with javascript i.e. element.value = 'xxxxxxxx'; the formatting doesn't happen and the site evaluates the card number invalid. so how to programmatically achieve this. I am working on an extension which could auto fill card details.
I have tried using element.dispatchEvent(Keyboardevent) but it won't work.
the website on which i am trying is made on top of angular.
I have found a workaround. It was something like changing the value and then dispatching an event. Since I was working with angular I needed to dispatch input event. Related codes are:
element.value = 'anything';
//dispatching input event after setting value ( tested for angular)
element.dispatchEvent(new Event('input')) ;
I have built a form with Vuejs, which allows me to add word-pairs-objects to a array of words. After adding the focus should jump back to the first input field.
I have two forms on my page, the first one takes some general list information and will be hidden after submit. After this, the second form will be shown.
I tried this.$$.input_lang1.focus(), but the result was an error message (Uncaught TypeError: Cannot read property 'input_lang1' of undefined).
I also have tried it with jQuery. This results in a correct focus, but the value of the second input field will not be removed.
Here is the link to jsfiddle
Give the input an id, then use pure javascript.
For example, if the input id is initialInput:
document.getElementById("initialInput").focus();
Fiddle:
https://jsfiddle.net/76fua8js/2/
We are using the Taxonomy module for Sitecore: https://marketplace.sitecore.net/Modules/T/Taxonomy.aspx?sc_lang=en
The module works fine 90% of the time. The only catch is that when in a taxonomy field you select a value from the auto-complete options, the field doesn't seem to be marked as changed. This creates the occasional confusion with editors as when they publish the "Do you want to save?" prompt doesn't show and the content is published without tags.
If instead of selecting from the auto-complete we use the dialog box, everything works fine.
I looked at the markup, JavaScript and C# code and couldn't find a solution.
I even tried to set Sitecore.Context.ClientPage.Modified = true but it doesn't seem to do anything.
How can I force the save prompt to show?
I had a similar issue, I was updating a field using js and the experience editor wasnt detecting the change.
I got this working by doing the following using js:-
There is a save button state object saved in a view state field. You can grab by doing window.parent.document.getElementById("__SAVEBUTTONSTATE"). I then did the following:-
var saveButtonState = window.parent.document.getElementById("__SAVEBUTTONSTATE");
saveButtonState.value = 1;
saveButtonState.onchange();
This will make the save button enabled
In the experience editor, Sitecore wraps your sitecore item fields in an span element, which contain a unique id. (These are the fields you interact with in the experience editor). However, its not these values which Sitecore receives when you hit Save button. Sitecore actually stores values of your item fields in hidden inputs, so when you interact with the span element, in the background, these hidden inputs are being updated. So in order for Sitecore to receive your changes, you must update the corresponding hidden input. If you open Inspect element in the experience editor and search "scFieldValues", you will see these hidden inputs. I updated the field by using jquery:-
$('#scFieldValues').children('input').each(function () {
if (id.indexOf($(this).attr('id')) >= 0) {
$(this).val(value);
}
});
The id object is the id of the span element. The contents of that id is used in the id of the hidden input. This is why I use "id.IndexOf" to find correct input element. So when I update the span element value, I grab that value and update the corresponding input.
Hope this helps
I need to create a text area in which the user will input the auto responder code. I hope everyone knows this. The auto responder code will have a full form code provided by most of the auto responder services like mailchimp, aweber etc.
I need to use getElementByTagName or anything else to extract all the input elements from the pasted code.
For example I will have 3 boxes below this text area, one will have Name field, 2nd will be email field and 3rd will be a box which will add all the hidden fields extracted from the above text area.
Yes, getElementsByTagName exists already.