Populate div input form field value with variable data - html

I'm trying to display the data stored in a variable into a form field. The variable programme_title definitely holds the data as I have tested it through other methods.
However, when I use the following, the entry form field simply reads "programme_title". How can I get the data from the variable to fill the field?
<div> Item 1 <input name=item_description-0-item value=programme_title>
</div>

I assume from the "jinja2" tag you're using jinja2 templates, where variables/expressions are placed in {{ }}:
<input name="item_description-0-item" value="{{ programme_title }}">
If it's just HTML + JavaScript then set the value property of the input element, for example by this JavaScript expression:
document.querySelector('[name="item_description-0-item"]').value = 'programme_title';

Related

How to display a string with space in an input?

I have a field "comment" in my site and I want to make it editable. To do that, I use an input field and with a javascript function it is saved in my database. However sometimes a comment has already been saved and I want to display it the user but it only displays the first word, it means Nothing is dispayed after the first space even if there is no problem in the database.
<input id ="comment"
class="w3-col round subsection-overview w3-hover-shadow"
data-url="{{ request.path }}"
onKeyPress="saveComment('data-url',this, '{{object.pk}}')"
value ={{object.comment | default:''}} >
</input>
Below the input field, there is the real value of the comment
image
You are missing quotes around your value attribute:
value="{{object.comment | default:''}}" >
Also, the default should not be necessary:
value="{{object.comment}}" >

Input type JSON html or angular

I am trying to create a form field which takes input as JSON. For that I created one input form field as text and pass value as JSON.
Static Tags: <input type="text" name="staticTags">
In the input fiedl form I am directly passing {"tag1":"value1"}
After submit I am getting the data as "{"tag1":"value1"}", instead I want the data as {"tag1":"value1"}. Do we have a way to have a text/JSON data without coat on left and right end?

format number in input box with two decimal place

I have below input control in my html
<input id="inputcntrl" type="text" value="{{(mynumber) | number:'2.2-2'}}" [(ngModel)]="mynumber" (blur)="validatemynumber()" />
As you can see I am formatting input text to make sure it has two decimal values. It does work correctly when user enters the value in input box. onBlur event I am checking the value entered by user and if it is not within the range (min >mynumber>max) then I am setting mynumber with min value. Problem is mynumber displays min value with no formatting. forex: If min valule is 10 then input box should display 10.00 but it displays only 10..any idea how can I fix this? I am using angular2
Update: I think problem in my case is with somehow related to binding..When I update mynumber from my component and the new value is reflected in UI but its formatting is lost. mynumber variable is of type number. I need to find a way to update value with formatting from component
Try mynumber.toFixed(2)
<input id="inputcntrl" type="text" value="{{mynumber.toFixed(2)}}" [(ngModel)]="mynumber" (blur)="validatemynumber()" />
Here is a reference documentation: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toFixed
If you want to format mynumber at your component with an angular way, try using built-in DecimalPipe at your component(the same as number pipe used at your template).
import { DecimalPipe } from '#angular/common'
this.mynumber = this.decimal.transform(this.mynumber, '2.2-2');
Plunker demo

Select list gives text between option text

I have the following dropdownlist/ selectlist in my form:
<select class="form-control" id="properties" name="properties1"><option value"35" disabled>white (Sold Out)</option><option value"36" disabled>yellow (Sold Out)</option><option value"37" >blue </option></select>
Why is this returning the value between the option tags instead of the value of the options? I need the Id's ofcourse.
I am using Laravel and process this form data with this tag: Input::get('properties');
That's because the syntax of the HTML is wrong.
You are missing the equals sign between the attribute names and attribute values. The value"35" should be value="35".

Putting HTML in a hidden form field in Django

I'm having a problem with a template: I'm trying to display a form for changing a value, in which the user enters the current value in a textarea and the old value is kept inside a hidden field for auditing purposes. This value is generally some HTML, and when I render the page this HTML in the hidden field seems to get partially rendered: the value attribute of my hidden field gets closed by the first quotation marks inside the entered HTML, and the rest of the HTML spews out onto my page. I've tried using the escape decorator but that hasn't changed anything.
Firstly, a better solution might be to keep the audit value in a separate model field defined with editable=False. You can still perform checks against the value in a form's clean method:
def clean(self):
cleaned_data = super(SomeForm, self).clean()
if instance.the_audit_field == cleaned_data['the_editable_field']:
...raise a validation error?
You can also modify the value of the audit field from within the model's save method.
Secondly, assuming you must do it the way you are now, let me address the non-escaped value in your template. I assume you're using something like the following:
<textarea value="{{ form.the_audit_field.value }}"></textarea>
You should instead use the following:
<textarea>{{ form.the_audit_field.value }}</textarea>
Note, the value goes inside the textarea, instead of in the value attribute of it.
An even better way to do it is to simply allow Django to render the field for you like the following:
{{ form.the_audit_field }}