Sorry for my English.
I need to change input value format, for example: from "1000000" to "1 000 000 $".
In my views of rails app, I have this line of code:
<%= ng_text_field('total_price', 'selected.data.total_price', 'Full price', ng_readonly: '!selected.permissions.update') %>
In helper:
def ng_text_field(name, ng_model, placeholder, options = {})
result = <<-HTML
<div class="form-group" ng-class='{"has-error":errors.#{name}}' #{options[:ng_if] && "ng-if=\"#{options[:ng_if]}\""}>
<label for="#{name}" class="col-sm-3 control-label">#{placeholder}</label>
<div class="col-sm-9">
<input id="#{name}"
type="text"
class="form-control"
name="#{name}"
placeholder="#{placeholder}"
ng-model="#{ng_model}"
#{options[:ng_readonly] && "ng-readonly=\"#{options[:ng_readonly]}\""}>
<p class="help-block small" ng-if="errors.#{name}">{{errors.#{name} | join:',' }}</p>
</div>
</div>
HTML
result.html_safe
end
I am know Angular very little, I have tried some ways and all this ways was incorrect. :(
Could anyone give advice of some help?
Thank you in advance
You're going to need to create a new directive that requires ngModel and applies the appropriate $parser/$formatter to it.
https://docs.angularjs.org/api/ng/type/ngModel.NgModelController#$parsers
A good example of how to do this is (displaying as uppercase but always storing data as lowercase):
ngModel Formatters and Parsers
You should be able to then add the ability to include other directives in your 'options' argument so that they get added correctly to the output.
Related
How can we write HTML and string literals at a same time in Thymeleaf ?
<div class="details"><span class="Section" th:utext="'Sec' <br> ${wind.sec}"></span><span class="Axiom" th:utext="'Axiom' <br> ${wind.axiom}"></span></div>
This throws error
Cannot execute GREATER THAN from Expression "('Sec' < br) > ${wind.sec}". Left is "true", right is "Great"
You can use the following = which uses + for string concatenation:
<div class="details">
<span class="Section" th:utext="'Sec<br>' + ${wind.sec}"></span>
<span class="Axiom" th:utext="'Axiom<br>' + ${wind.axiom}"></span>
</div>
The <br> is just part of the text literal in this case - because you are using th:utext.
However, using unescaped values such as ${wind.sec} is unsafe and is not recommended. There could be harmful values in that variable - especially if the variable holds data provided by end users.
So, unless the following structure change poses a problem, I would recommend something like this:
<div class="details">
<span class="Section" th:utext="'Sec<br>'"></span>
<span class="Section" th:text="${wind.sec}"></span>
<span class="Axiom" th:utext="'Axiom<br>'"></span>
<span class="Axiom" th:text="${wind.axiom}"></span>
</div>
Here we have separated the true text literals (which can use th:utext) from the variables (which should use th:text). Now, any HTML which may have found its way into your ${...} variables will be escaped, rendering it harmless.
I have an input that looks like this:
<%= f.input :email %>
The output I get from formtastic(v3.1.5) and rails(v4.2) looks like this.
<li class="email input required stringish" id="applicant_email_input">
<label for="applicant_email" class="label">Email<abbr title="required">*</abbr></label>
<input maxlength="255" id="applicant_email" type="email" value="davedave#gmail.com" name="applicant[email]">
</li>
What I really want is for formtastic to emit:
<div class="email input required stringish form-group" id="applicant_email_input">
<label for="applicant_email" class=" control-label">Email<abbr title="required">*</abbr></label>
<span class="form-wrapper">
<input maxlength="255" id="applicant_email" type="email" value="davedave#gmail.com" name="applicant[email]" class="form-control">
</span>
</div>
This is what this app emmitted with formtastic(v2.3.1) and formtastic-bootstrap(v3.0.0) and rails(v4.1).
I'd love to just include the gem for formtastic-bootstrap and get that old behavior back, but near as I can tell, formtastic-bootstrap dropped out around formtastic 3.
Now I have an app with a couple thousand calls to f.input, and I need to massage the output coming from formtastic. What's the best way to do that?
Maybe you could use formtastic's custom input? Also, these links might help: https://github.com/justinfrench/formtastic/blob/master/lib/formtastic/helpers/input_helper.rb and https://github.com/justinfrench/formtastic/issues/625.
Specifically, Justin French recommends that you monkey patch your app with an initializer in config/initializers/formtastic_patches.rb that would look something like this:
module Formtastic
module Inputs
module Base
module Wrapping
def input_wrapping(&block)
template.content_tag(:li,
[template.capture(&block), error_html, hint_html].join("\n").html_safe,
wrapper_html_options
)
end
end
end
end
end
And then switch the :li for a :div.
Here is a hacked version of formtastic I have named boomtastic which will do what you want.
(This actually includes all that you require except for the form-wrapper. However, the form-wrapper seems to be an element of bootstrap-formtastic only and not part of formtastic or standard bootstrap. If you really want to have the <span class="form-wrapper">, I think you can add this by editing boomtastic/lib/formtastic/inputs/base/wrapping.rb.)
What about a solution that uses jquery to change your form at page reload?
var ready = function () {
var $input = $('#applicant_email');
var input_html = $input.html();
$input.html('<span class="form-wrapper">' + input_html + '</span>');
}
$(document).on('turbolinks:load', ready);
You need to tell me how you want to select those fields, because in your example you did not include the full html and any explanation of the real problem.
I also see that the other divs have some other classes, that can be done with some easy jquery
Otherwise you can edit that gem
I had a little problem on Prestashop 1.7.2.0, I want to add some field in my contact us form but don't know how to proceed.
I just find tuto for PS 1.6.
If someone could help me.
Thanks a lot
Here a no update resistant solution to add a field Name:
I tried the following thing to add a field (and remember this solution is not update proof and the additional fields are not safed in the backoffice):
Update contact.html + contact.txt in the theme/mails folder:
<span style="color:#333"><strong>Name: {contactname}</strong></span><br /><br />
Add the contactname line to the $var_list array in the file contactform.php located in the modules/contactform folder:
$var_list = [
'{order_name}' => '-',
'{attached_file}' => '-',
'{message}' => Tools::nl2br(stripslashes($message)),
'{email}' => $from,
'{product_name}' => '',
'{contactname}' => Tools::nl2br(stripslashes($contactname)),
];
Add a line to the beginning of the function sendMessage(){ in the same file (contactform.php)
$contactname = trim(Tools::getValue('contactname'));
Add the following lines to the part in the file contactform.tpl located in the theme/modules/contactform/views/template/widget folder:
<div class="form-group row">
<label class="col-md-3 form-control-label">{l s='Name' d='Shop.Forms.Labels'}</label>
<div class="col-md-6">
<input
class="form-control"
name="contactname"
type="text"
value="{$contact.contactname}"
placeholder="{l s='Ihr Name' d='Shop.Forms.Help'}"
>
</div>
</div>
I know it's ugly, but hey, it's a start :) as soon as prestashop 1.7 is not buggy anymore I will start programming with proper overrides/modules
Feels like a dumb question but I do not get it. How can I do fast string concatenation in Angular 2 Dart templates?
I have a seperate html file for my component lets say my_component.html:
Works:
....
<div id="abc">
{{order.pickupPlace.email}}
</div>
...
Works:
....
<div id="abc">
{{ ((order.pickupPlace.state) ? order.pickupPlace.state+" ":'')}}
</div>
...
Does not work:
....
<div id="abc">
{{"<br/>"+order.pickupPlace.email}}
</div>
...
Does not work:
....
<div id="abc">
{{order.pickupPlace.name+" "+order.pickupPlace.email}}
</div>
...
Have tried to find an answer in the docs here (https://webdev.dartlang.org/angular/guide/template-syntax#!#expression-operators) but no luck.
Of course I could use *ngIf on every element which I output conditionally but is there a way for simple string concatenation?
The best way is to declare a getter inside your Component controller that does the concatenation for you, you will get dart syntax support and the html template will looks cleaner.
String get myConcatenation => "${order.pickupPlace.name}${order.pickupPlace.email}";
<div id="abc">
{{myConcatenation}}
</div>
The last two examples can be made to work easily:
<div id="abc">
<br/>{{order.pickupPlace.email}}
</div>
And:
<div id="abc">
{{order.pickupPlace.name}} {{order.pickupPlace.email}}
</div>
Angular handles this pretty well. If you need some more complicated logic you can move it to the Dart code (but you cannot use HTML there easily).
If you find creating lot of weird logic consider creating more smaller components that can handle this for you.
I would like to find a way to customize the default error html
<div class="field_with_errors"></div>
To take my own classes:
<div class="clearfix error">
<label for="errorInput">Input with error</label>
<div class="input">
<input class="xlarge error" id="errorInput" name="errorInput" size="30" type="text">
<span class="help-inline">Small snippet of help text</span>
</div>
</div>
I have found this railscast from 2007 which uses Rails 2, I believe. http://railscasts.com/episodes/39-customize-field-error. It seems like Rails 3 might have a more friendly way to customize this html?
Also, it doesn't show a way to just add an error class directly to the input like I want.
The method explained in the link you posted is still used today with the vanilla form builders in Rails.
So, if you wanted to wrap your input like you mention, create a method overriding the ActionView::Base.field_error_proc in your environment.rb file for example, like so:
ActionView::Base.field_error_proc = Proc.new do |html_tag, instance|
if instance.error_message.kind_of?(Array)
%(<div class="form-field error">#{html_tag}<small class="error">
#{instance.error_message.join(',')}</small></div).html_safe
else
%(<div class="form-field error">#{html_tag}<small class="error">
#{instance.error_message}</small></div).html_safe
end
end
In the above code, I'm wrapping my input (the #{html_tag}) in a <div class="form-field error>..</div> that's the default used by ZURB Foundation. I'm also using a <small class="error">...</small tag (which is also the foundation default) to display the messages below the input.
However, I recommend using a form builder gem like simple_form. It cleans up your view code quit a bit and allows for the level of customization you require.
Check out the railscast on it here.
Good luck!