I'm trying to use the DataAnnotations RegularExpression attribute on a property of an item in a collection - A Field object has a collection for Formatter objects that in turn have a collection of Attributes with a Value property.
Inside my attribute view model class, I have:
[RegularExpression(#"^\d+$", ErrorMessage = "That didn't do what you hoped it would do")]
public string Value { get; set; }
I have this in my view:
#Html.TextBoxFor( x => x.Formatters[fmt].Attributes[att].Value )
and it produces this markup:
<input type="text" value=" " name="Formatters[1].Attributes[0].Value" data-val-regex-pattern="^\d+$" data-val-regex="That didn't do what you hoped it would do" data-val="true" >
All of that seems right, but the validation always fails the first time. If I enter 23 into the textbox and tab out, it fires the validation event and tells me things didn't go like I'd hoped they would. If I go back to the field and enter the exact same value, it works. If I enter letters, it still fails as it should.
Anyone have any idea what I might be doing wrong or what I can do to coerce the validation into behaving the first time around? It seems to be related to the collections somehow because if I put the same validation attribute on a top level property, it works as it should.
Thanks!
This issue appears to be isolated to my laptop at work. I pulled down the code to a couple of other computers at home last night and everything works as expected.
I'm still not sure what's going on, but I don't think this is something the community can help resolve - unless someone wants to loan me a hammer.
Thanks for reading and thanks to Darin for trying to dig deeper.
Related
New to ember.js -- used http://yoember.com/ to create a Demo ember.js site. I'm trying to figure out how to use Protractor to test certain elements, but I'm encountering issues specifying them.
Most, but not all, elements (buttons, text areas, etc) have a serialized id value: id='ember###' that changes every time the page is reloaded, which makes it impossible to indicate some elements in Protractor (like, element(by.id('ember557')).sendKeys('foo');).
Running a command like the one above will return the error: Failed: No element found using locator: By(css selector, *[id="ember557"]), which is due to the 3-digit id value changing.
In my demo app, I was able to go into the /app/templates/components/ file for that page and manually add something like id='name' into the handlebars input and was able to successfully find and test that element in Protractor.
This isn't ideal though, and I'd like to find a way to test sites that I don't have the ability to modify the html of.
Can anyone help me wrap my head around this? Thanks.
I have a form here with a nested table - where each table can dynamically grow, i.e., the inner table (w/ Transit No and Account No) and the outer table (Accounts by ID No). Here is an example:
(Behind the buttons:
Add - $.parent.tbl.Row.instanceManager.addInstance();
Remove - $.parent.instanceManager.removeInstance(this.parent.index); (In
production I make sure there is at least one row to remove...)
In the definition for each table I do not have checked 'Repeat Table for Each Data Item'. This works great. However I did try with that checked and the outcome was the same.
Now, when I email the form and open the attachment, this is what I see:
You can see that the second table didn't make it, and apparently a row was added to the inner table in the first, without any data.
Any ideas on what's going wrong here? And what I can do about it?
Unfortunately I'm not sure what's wrong with your form but I have made a similar form that works - so I can show you how I did it and list a few things that I can think of that can cause problems.
This is what my form looks like and when I e-mail it, it comes out exactly the way it is:
(It has repeatable parent- and childsubforms like yours)
I did it entirely with JS though, no FormCalc and Dollar $igns :D
When a button is pressed I call a function from a Scriptobject.
These are the main parts of my script inside my functions:
Adding a Subform:
var oNewInstance = subform.instanceManager.addInstance(1);
Deleting a Subform:
if (subform.instanceManager.count > subform.instanceManager.occur.min)
{
subform.instanceManager.removeInstance(subform.index);
}
And these are my subforms' properties (in German, but you can figure it out :P):
Your problem might also have completely other reasons though, make sure you don't have any changes in an initialize,docReady, preSubmit and similar actions that occur between sending and opening the sent PDF.
Also before sending it as an e-mail you have to save it in Acrobat as a Reader Extended PDF:
Besides that I've noticed that sometimes problems can occur due to the target version (Selectable in LCD under File > Form Properties > Defaults).
It helped me sometimes to set it to the newest one.
We upgraded to Ember 1.11.1 and Ember-validations 2.0.0-alpha.3.
Controller
export default Ember.Controller.extend(EmberValidations.Mixin, {
canValidate: true,
validationModel: Ember.computed.alias("model"),
validations: {
'validationModel.name': {
presence: { 'if': 'canValidate', message: 'Please enter a name'},
},
},
}
Template
{{log "error value" errors.validationModel.name}}
{{input classBinding="errors.validationModel.name:app_input_box_error:app_input_box" placeholder="Document Name" value=model.name}}
With the above template code in place, validations works as expected and the input's class is swopped out depending on whether there is a validation error or not. However, when the {{log}} line is removed, the class binding seems to be lost and the input class is no longer appropriately updated. Any advice on the cause/fix please?
Note Class bindings outside helpers e.g. in a standard div continues to work properly
Maybe try this:
{{input classBinding="errors.validationModel.name:app_input_box_error:app_input_box" placeholder="Document Name" value=validationModel.name}}
I'm not seeing classBinding but classNameBindings in the docs, I'm not sure if something was deprecated along the way.
I would suspect that the classBinding is not triggering the property to be updated, I seem to recall some issues with this on ember-validations at one point not always triggering. Have a look at https://github.com/aceofspades/ember-validations/commit/85ecaa348f2a1ccfb52f614037c4b4dbf77bceb4 and see if that might help.
From a higher level, I would think you'd be repeating this pattern often, adding a class name based on errors ties to the specific field. Personally I might spend some time looking for or building an input component that handles the annotation for ember-validations, where you can have a fieldName property and have it look at the appropriate errors.validation.${fieldName}. Coding in JS might help or at least make it easier to debug.
This is not precisely related to individual fields but might also be of help to you, in particular moving to HTMLBars syntax, i.e.
{{input class="{{if errors.validationModel.name 'app_input_box_error' 'app_input_box'}}"}}
I am trying to use a fairly simple Handlebars helper within an #each loop going over the items in a controller's model (it's a collection of models supplied by EmberData using the fixtureAdapter). Here's the basic layout of the template:
{{#each}}
....
{{#each clusters}}
<span>{{prettifyTimestampTime cluster_timestamp}}</span>
{{/each}}
{{/each}}
Here is my helper (in coffeescript):
Ember.Handlebars.registerBoundHelper 'prettifyTimestampTime', (timestamp, options) ->
d = new Date timestamp
hours = String(d.getHours() % 12)
hours = "0#{hours}" if hours.length is 1
"#{hours}:#{d.getMinutes()}:#{d.getMinutes()}"
I originally set this helper on Handlebars itself with Handelbars.registerHelper, but I kept getting the string "cluster_timestamp" passed in (no matter what I put after prettifyTimestampTime in the template, it would get resolved to a String).
I then followed suit and attempted to give stukennedy's answer a try by wrapping the property in quotes and doing a lookup on options.data.keywords, but the key wasn't in that dictionary.
When I to tried to use Ember.Handlebars.registerBoundHelper instead, per Bradley Preist's suggestion here, the timestamp argument is simply undefined. I do notice that, when I try to access any properties on options.contexts[0], the values they point to are undefined, but the keys are there.
I feel completely lost at this point. Any direction is welcome. Is this really a known bug in Ember, as stukennedy has pointed out in the previous SO questions? Having just started with Ember and Handlebars, I would rather have this just be some dumb error on my end, considering how difficult it was for me to also to set up fixtures with Ember data in the first place. :-P
EDIT: After seeing this question, I realize why registerHelper did not work (because it does not try to associate what is passed in with the property of the current object in context). However, I'm still just as lost since the lookup of the property isn't working. Perhaps this is an Ember Data issue with promises? The only thing that makes me confused about that being the case is that I am using fixtures (no request made), and I am able to get at the property cluster_timestamp normally with a normal expression like {{cluster_timestamp}}.
don't use registerHelper, http://emberjs.com/guides/templates/writing-helpers/
Ember.Handlebars.helper 'prettifyTimestampTime', (timestamp, options) ->
d = new Date timestamp
hours = String(d.getHours() % 12)
hours = "0#{hours}" if hours.length is 1
"#{hours}:#{d.getMinutes()}:#{d.getMinutes()}"
Somewhere in my code, I hit a bug. I put a breakpoint to try and see what is happening. When I inspect the object "foo" in the console I get:
foo.toString() > "<App.Foo:ember661:174009>" // all good
foo.get('isLoaded') > true
foo.get('isValid') > true
Yet:
foo.get('name') > null // Whereas it definitely has a name.
When I look at the Network tab in the developer tools, I can see that it is still "finishing" to load the record. For the corresponding URL, it says: "pending".
What is this model state? How do you know when a model is "fully" ready?
UPDATE: per my comment to Mike, I should have added that I am inspecting this record within a registerBoundHelper function. So I guess there is a context issue that I am missing. Indeed:
... foo template ...
{{ name }} // properly set to a value
{{ my_helper this }}
... helpers ...
Ember.Handlebars.registerBoundHelper('my_helper', function(foo) {
return foo.get('name'); // name property is null!!
});
I must be missing something obvious?
Thanks,
PJ
What is this model state?
Can't tell given the info you provided, but to find out from console you could try this:
foo.stateManager.get('currentPath') > should be something like "rootState.loaded.saved"
Then have a look at states.js source code for details on that state.
How do you know when a model is "fully" ready?
Depends what you mean by fully and ready. Some tricks to help you see what's what:
Show me the raw data for a model
foo.get('data')
foo.get('data.attributes')
Get console log output when the record transitions between states
record.set("stateManager.enableLogging", true)
Answering my own question, in case it helps someone else...
This strange behaviour came from a context issue for the helper. It was pretty "deep" in a view (several nested levels down) and I am using a combination of {{partial}} and the new {{render}} that you can now use multiple times (on master). I'd lie if I were to say I am totally clear with what was happening, but I tried various contexts switches and it ended up working.
So I guess if you hit something like that, double check your helpers's context...