Dynamically populating an ExtJS HTML editor - javascript

So I'm using ExtJS for a job I'm working and I'm trying to dynamically populate the textarea associated with the HTML editor with data based on what a user selects from a combo box. From what I've found, I can load the HTML editor with text using the defaultValue property. So if I'm going to populate it after the page loads, can I give it something like a datastore or is there a method I can call to set the text?

Just call foo.setValue("bar");, like with all form inputs.
http://www.extjs.com/deploy/dev/docs/source/Field.html#method-Ext.form.Field-setValue
http://www.extjs.com/deploy/dev/docs/?class=Ext.form.HtmlEditor

Related

How to add JavaScript code to Laravel for BackPack?

I'm using Laravel BackPack to expedite my CRUD webapp.
I have a form with a dropdown list of users.
When a user is selected from this list, I want to populate a text box on the same form with the username of the selected user.
I normally use JavaScript to query the table and return the JSON result.
The returned data is used to populate the #username text box.
I am not sure where to add this JavaScript code in BackPack.
Thanks for your suggestions.
I recommend you create a new field type, starting from the select2 field (or whatever you're using now), and add your JS there.

Populate Umbraco content form with Javascript

I trying to create a custom property editor for Umbraco 7 that talks to an external web service, retrieves some data then populates a number fields in the form with the data it's retrieved. I've tried doing this with the following simple code:
$("#textbox_id").val("new value");
This does indeed populate the correct field with the correct data. However if I save and reload the form the data has not been updated and value returns to it's original value.
Any suggestions?
The problem is that you are using jQuery to update the input field directly in the DOM. The backoffice of Umbraco is completely wired up with an angular model and this model is not notified of the change in this input field when you are not actually typing in the field.
You can however trigger the input even on the form fields after updating the value of the field, which will ensure that angular gets notified of the change and it will update its model.
Something like this should get the job done and the change should now be included when you hit the save button:
$("#textbox_id").val("new value").trigger("input");

Over-shadowing label when pre-populating value to form

I'm using Materialized CSS and it works very well for me. However when I added more dynamic behaviour to my app, for example when I'm pre-populating form with values and appending them to the layout, here is the photo of that:
That happens only when I preset the value to form on/prior to page load (because my form html is generated by server side).
However if I were to click into the quantity field then quantity would go back to its place and it would stay there.
How do I make it so that it stays up even when I pre-populate the form value? Is there a class I need to add to it (label or input) or JavaScript or something that I can put out there.
If you want to pre-fill text inputs, use Materialize.updateTextField(); as the docs says

Pulling data from a widget in Dashing

I created a widget with a drop down menu and i want to update my ruby query with the value selected in the HTML drop down menu. I am currently using nokogiri to pull the localhost dashboard. nokogiri is able to pull the data from the sample.erb. However, the HTML files that contain the actual information (including the drop down) is not grabbed by nokogiri. the HTML grabbed stops with the data-binding div, nothing inside of that appears when i print out the nokogiri pull. Is there anyway i can grab the entire HTML or pass the value to the ruby from the HTML or coffeescript?
In your widget, you need to grab the data from the DOM. nokogiri can only grab the server-side HTML that you're rendering (what is sent to the client).
The HTML with the data that the user is selecting options in is actually called the DOM, which you can get information from using JavaScript -- or in this case, coffeescript.
Say you have a dropdown like this:
<select id='day-of-week'>
You can bind a handler to it's change event and respond to it like this:
dropdown = $('#day-of-week'); // Use jQuery to get the select by id
dropdown.on 'change', () ->
selectedValue = $(this).val(); // jQuery to get selected value of dropdown
You probably want to learn a bit more about HTML / JS before embarking on your widget-building journey. Here's some documentation on the DOM to get you started:
https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model
Good luck!

Grails Dynamic Form Fields

I want to do something like below using Grails:
I can achieve the simple text field using jquery/js. However I need to add the dynamic form field for dropdown list and use Grails gsp tag. But I can't put something like:
var line = "<g:select/>";
in the javascript to add a row. Because there i no GSP engine for javascript.
Also for deleting a row, there is no id in my project, so not quite sure how to delete a row using dynamic form fields.

Categories

Resources