make an input field required in ember.js - ember.js

I know there is a way in plain html to require the field have some kind of value. I believe it's 'input required'.
However, I'm not sure how to accomplish this in ember using handlebars. I've tried this but it was unsuccessful:
{{input required value=tax class="form-control" placeholder="State Tax"}}
Thanks in advance.

In ember input helpers you always have to give values to attributes. The shourtcuts like <input disabled required value="..."/> in html without value are not allowed in handlebars. Instead you have to write {{input disabled=true required=true value="..."/>
See ember twiddle with your example: https://ember-twiddle.com/b073b4551065e8884056de55fe0c9800?openFiles=templates.application.hbs%2C

Related

Salesforce lightning Input with list doesn't work

I'm trying use input with datalist in a lightning component and doesn't seem to work. I've looked around and can't seem to find anything that says i can't. So basically,
<input list="acctlist"/>
<datalist id="acctlist">
<option value="somevalue">
</datalist>
does not work. I want to have an input in a form that a user can type but also able to select from a list returned from the controller. Is there a workaround that would be as simple or is this the following route the best i got.
https://developer.salesforce.com/blogs/developer-relations/2015/06/salesforce-lightning-inputlookup-missing-component.html
The list attribute of input tag is not compatible with lightning component.
When you deploy the components, the attribute is removed.
If you want to use input with datalist, you need to add the attribute in Renderer.js.
datalist.cmp
<input aura:id="acctlistInput" />
<datalist id="acctlist">
<option value="somevalue" />
</datalist>
datalistRenderer.js
afterRender : function(component, helper) {
var acctlistInputCmp = component.find("acctlistInput");
var acctlistInput = acctlistInputCmp.getElement();
acctlistInput.setAttribute("list", "acctlist");
return this.superAfterRender();
}

Show BooleanField checkbox before label

I'm in the process of trying to minimize the amount of code I need to use to render a form with bootstrap styling with the hope of rendering with just {{ form }} but I haven't yet managed to find a way to render a BooleanField with the checkbox before the text.
from django.forms import Form, BooleanField
class MyForm(Form):
field = BooleanField(label='Test Label')
MyForm().as_table()
The above test code will output
<tr><th><label for="id_field">Test Label:</label></th><td><input class="" id="id_field" name="field" type="checkbox" /></td></tr>
But what I'm hoping to achieve is the same look and feel as shown in the bootstrap docs.
<label for="id_field"><input class="" id="id_field" name="field" type="checkbox" />Test Label:</label>
The problem in doing this is that the rendering is handled via the form, where the label and the field are positioned/rendered separately, and I have yet to find a place to override that will allow me to render the widget inside of the label...
Any ideas how I can achieve this?
I don't want to use django-bootstrap3 etc, and I've looked through the source code for them too and cant see anywhere where they've managed to achieve this either.
It turns out this is much more intrinsic to do than it would appear to be and involves providing a form field mixin as well as a custom widget.
All too much work for me to maintain.
However!
django-angular has managed to achieve this with their own CheckboxInput and associated BooleanFieldMixin, since this is something I am planning on using, it has resolved my issue.

how to set two class name for Ember.js input helper

i'm trying to bind an input element like this:
{{input value=email type="text" placeholder="Enter email" class=emailError:with-error}}
it works just fine, as long as I try to assign it only 1 class name ".with-error".
how can I assign 2 class names, so it will be: ".with-error .second-class"?
I know how to do it with:
{{bind-attr class=":secondClass emailError:with-error"}}
but this doesn't work with input helper.
Thanks!
This feature is not well documented, but when defining attributes on a Handlebars helper, you can either leave out the quotes to indicate that you want the value of the attribute to be a bound variable, or you can add the suffix "Binding" and then use quotes with an expression similar to the one you would use with {{bind-attr}}.
So, in your case, the following should work:
{{input value=email type="text" placeholder="Enter email" classBinding="emailError:with-error :myClassName"}}
Note how instead of class=myBoundValues we are using classBinding="myBoundValue".

Meteor.js template reactivity keep some data

Using meteor.js and i am kind of stuck with the structure of template or how to do this trick as clear as possible.
Example of my chating app problem:
chatingWith = DB query for selecting each user i am chating with like on FB // REACTIVE
{{#each chatingWith}}
{{#each this.messages}}
Message1...
Message2...
{{/each}}
<form>
<input class="sendMessage" type="text" />
</form>
{{/each}}
This works exactly as i need but with one big problem... when new message arrive... the content is re-rendered ofc and when i am in this time writing a message the value of will dissapear.
How would you solve this?
Sorry for english and thx for tips!
There is a section in the documents about preserving inputs. http://docs.meteor.com/#template_preserve
From my understanding, as long as you have the package preserve-inputs installed, it should keep the reactive nature of meteor from erasing the input. I would check to see if the preserve-inputs package is installed.

Dynamically set default form values in django

I'm trying to find a way to dynamically set default form values. So for example, if I add a facebook login feature on my webpage, and I can get his first name and last name from what the facebook javascript returns, I want to be able to set these values as the new "value" parameter in the given form. (basically so I'm able to put the user in my database)
I was hoping that there is some sort of
{{ form.firstname.default = Javascript.return.firstname }}
that I can insert into a template but there isn't...
Any ideas? Thank you.
Edit;; Maybe it would be better to first pass in the information into a views.py? But how would I do this? I am just considering hand writing the inputs out in the javascript field, which would be annoying...
You can set the default value of a template variable:
{{ form.firstname|default:Javascript.return.firstname }}
assuming that {{ Javascript.return.firstname }} is valid in that template context.
The code generated by Django is all server-side, its templates can't use anything which isn't available when the page is loaded. You need to use javascript to set the value.
For example, if your form looks like this:
<form id="login">
<input name="firstname" />
</form>
You could use this javascript (assuming you're using jQuery):
// Do the facebook login, set the var fname to the first name, then:
$('#login [name=firstname]').val(fname);