Get value of an input field in Blazor without #oninput - javascript

I have an HTML <input> element that is generated by a Blazor <InputText> component.
I am using a JavaScript library to detect when the user scans a barcode. When this event occurs I set the value of the scanned barcode into the <input> element.
I want to be aware of this change of value immediately in C#. Normally I'd use #bind-event:oninput to ensure I have the current value immediately whenever it changes, but this event isn't fired when the HTML input's value is set via code.
Is there a way to assign a value to an HTML input via JavaScript and then have C# immediately aware of the change and update the property of the C# object the InputText control is bound to?

I have solved this the following way:
Where you have the value in JS that you want in C#, apply it to a field and call .click() on a button. This button calls a C# method that invokes a JS function that returns the value of the input as a string to your C# method, which you can now use however you want.
While it is a dirty solution, it worked.
I have tried to get invokeMethodAsync to call my C# method directly, but that required it to be static and I simply didn't have the time for this project to do it the proper way.

Related

Jquery detect textbox programmatic change

Long story short I am cowboying some code in which a custom framework I am using allows me to insert a script to manipulate the page to do what I want.
I want to fire a function, but only after the textbox I want to use has been populated from the webservice that gets called.
In Jquery/Javascript is there anyway to call a function like the jquery change function, but one that can detect when the textbox has been changed from javascript, and not by the user in the browser.
I currently just have:
$("#mytexbox").on('input propertychange paste change',function() {
doSomething();
});
But this does not fire when the original function in locked code sets the value of the textbox.
Note: I can not just overload the original function as most of it is built up from dynamic server side code that I can't mimic in Javascript.
I also want to avoid having to use setTimeout() as this is unreliable and not really a nice solution.
Thanks in advance!
Maybe you can use a hidden div or input and check the changes on this instead of changes on #mytextbox. Obviously, the user can not change the hidden div, but the script can. You get the trick? ;)

How do I check the value of an ng-model bound input field programmatically using Ranorex?

We have an input field in html which is bound to a javascript value via [ng-model]. What we've found is that the text value bound to does not actually appear in the DOM, which seems to be by design.
However, we test certain elements via Ranorex, and we'd like to test this one, and Ranorex doesn't (as far as we know) have access to the Angular scope, only the DOM, via "AccessibleValue".
This would seem to be the same problem we'd have to solve if we wanted to check any user-entered text in Ranorex, we're just not sure how to solve it.
How do I check the value of an ng-model bound input field programmatically using Ranorex?
EDIT: We've actually found this is an artifact of running angular inside a QtWebView (in the real world, you can just check the input's value), which means we've got 3 independent programs that we're expecting to behave nicely with each other...
Maybe it is possible to get the values by using the ExecuteScript() method.
A code sample can be found on the following forum post:
http://www.ranorex.com/forum/code-snippet-for-executescript-function-with-return-type-t5070.html#p21345
I hope that helps.

How to differentiate manual save and programmatic save in CRM 2011 JScript

I have a Javascript code registered onSave of record. I need to check whether the save operation is happening by clicking on Save button or saving programmatically like Xrm.Page.data.entity.save().
Do we have a JScript code to get the source control of the event, means event generator?
Without this information on the context why not set a variable in the JavaScript function where you call entity.save explicitly? You can then check this from any other JavaScript function to determine "context". It's a bit of a hacky global flag but it'll do the job.
If you need to get a hold of this "context" within a plugin you can create a hidden attribute on the form setting submitMode('always') that you set prior to save within the custom JavaScript and reset on load.
Have you tried something like that: https://community.dynamics.com/product/crm/f/117/t/58773.aspx

Setting the textbox to read only on submit

Can anyone suggest me a javascript function to set the text box to readonly on pressing the submit button. So that the contents cannot be modified.
To disable an input you'll want to set its disabled attribute. If you can use jQuery then something like this would be what you're looking for:
$('#idOfYourInput').attr('disabled', true);
If jQuery isn't an option, then you'll want to use the setAttribute function. Take a look at the MDN documentation for it. Something like this:
var d = document.getElementById('idOfYourInput');
d.setAttribute('disabled', 'true');
(Both of these code samples assume that you're identifying your input by its id attribute. If that's not the case, these would need to change. The jQuery one would be trivial to change, you'd just need to update your selector to identify the target attribute. The latter code sample would need to use some other DOM navigation/selection functions to find your input element.)
You'd want to include this within the handler for your submit button. Understand, however, that this will only matter on the current context of the page. So I'm assuming your submit button is being used to perform a submit via AJAX and not actually POST the whole page, correct? Because if you're POSTing the whole page then, when the page refreshes, you'll be on an entirely new page context. (Which means any code associated with a button click event will not yet have run.)

jQuery - input field change event not working ... as expected

I'm handling the "onChange" event of an HTML input file field by using jQuery's "change" function. This works as intended, and does indeed trigger when the element's value changes. However, not in the following scenario:
The user specifies a file to upload. We call this file "file.dat".
jQuery later sets the value of the file field to "", by using the
val-function.
The user specifies the exact same file to upload, "file.dat".
In the above scenario, "onChange" doesn't get called at step 3. However, if the user at step 3 specifies a different file, it does indeed get called.
Is it because I am using jQuery's val-function to change the value? What other alternatives do I have if I want to reset the input file field to its base/default value?
For security reasons, JavaScript is unable to affect the value of a file input. It does appear that the value has been cleared, but it hasn't really.
You can get around this by either resetting the entire form, or creating the element again and inserting it into the DOM, in place of the old one.
Here's a working example. Note the use of the jQuery live function to bind the change event. This is required because we are inserting a new element into the DOM every time the Clear button is clicked.
Have you tried .reset() instead of .val() ?

Categories

Resources