I'm working with some existing code that looks something like this:
ff.input :answer_id,
:as => :surveyor_radio,
:collection => [[a_text(a, nil, render_context).html_safe, a.id]],
:label => false,
:input_html => {:class => "someclass"),
:response_class => a.response_class
and generates something like this html:
<li class="choice">
<label for="123">
<input class="someclass" id="123" name="foo" type="radio" value="bar" />
BAR
</label>
</li>
I'd like to add a paragraph of explanatory text betwee the closing and the closing , like this:
<li class="choice">
<label for="123">
<input class="someclass" id="123" name="foo" type="radio" value="bar" />
BAR
</label>
<p>It is really important that you understand all of this information about BAR before you pick it, so read this carefully.</p>
</li>
I haven't had much luck finding a way to do this. Any ideas?
Thanks!
Related
Does hanami support below code?
<%= form_for :question, routes.question_path. method: 'post' do %>
<div class="box-body">
<div class="row">
<div class="box-body pad">
<textarea id="content"></textarea>
</div>`enter code here`
</div>
</div>
<% end %>
And how can I can do it in my template?
Though this is possible, the official Hanami guide discourages it as it has to resort to monkey patching in order to work with the various template engines.
You can read more about it here.
An alternative approach is to define a single form rendering method in your view, like this:
def form
form_for :question, routes.questions_path, method: 'post' do
div(class: 'box-body') do
div(class: 'row') do
div(class: 'box-body pad') do
text_area :content, id: 'content'
end
end
end
end
end
Then, somewhere in your template, you can call it like this to render the form:
<%= form %>
And I'm supported by author the best way I want is:
<form action="<%= routes.question_path %>" method="POST">
<input type="hidden" name="_csrf_token" value="<%= csrf_token%>">
<!-- rest of the form goes here -->
</form>
Maybe it's help for someone else.
I have multiple html helpers. When I click login button I am disabling user_register div using jquery and when I enter details the username and password the model binder is able to bind properly but when I click Register I am disabling user_login div and enabling user_register div and when I enter the details only email and firstname is what the model binder is able to bind and not username, password. Is this becoz I am using the same html helpers more than once. How to handle this. I have the following code
<div class="user_login">
<label>Email / Username</label>
#Html.TextBoxFor(model => model.Email)
<br />
<label>Password</label>
#Html.TextBoxFor(model => model.Password)
<br />
<div class="action_btns">
<div class="one_half"><i class="fa fa-angle-double-left"></i>Back
</div>
<div class="one_half last">
<input type="submit" style="border: none" name="action" class="btn btn_red" value="Login" />
</div>
</div>
Forgot password?
</div>
<div class="user_register">
<label>Full Name</label>
#Html.TextBoxFor(model => model.First_Name)<br />
<label>Email Address</label>
#Html.TextBox(model=>model.Email)<br />
<label>User Name</label>
#Html.TextBoxFor(model => model.User_Name)<br />
<label>Password</label>
#Html.TextBox(model=>model.Password") <br />
</div>
The controller follows here
public ActionResult Index(Customer customer, string Action)
{
//something here
}
You have not shown you complete view, but assuming all those controls are generated inside one form element, then all controls will post back unless you make the inputs disabled. If so, then the first input with name="Email" is bound and the second one is ignored by the DefaultModelBinder. (since the first one is only hidden, its value is probably empty). Your script needs to ensure that the 2 inputs in the login section are disabled, for example
#Html.TextBoxFor(model => model.Email, new { id = "login-email" })
and
$('#login-email').prop('disabled', true);
Note the id attribute so you can select the correct one (and prevent duplicate id's which is invalid html.
An alternative would be to create 2 separate forms.
What's wrong with this line of code?
<%= submit_tag "Delete <i class='icon-check'></i>".html_safe, :disable_with => "Deleting", :class => "btn btn-danger"%>
This literally produces:
Evidently my html_safe call isn't doing anything.
Background:
I'm using Twitter Bootstrap as well as Font Awesome and I'm essentially trying to achieve a submit button with an icon inside of it.
To extend on Lukas' answer I needed a button tag rather than an input. This code produced the effect I was looking for:
<button type="submit" class="btn btn-danger">
Delete <i class="icon-check"></i>
</button>
Which resulted in:
I found the answer I was looking for here.
What's wrong with it? Submit button values should not contain embedded HTML code.
This is how submit button looks in HTML:
<input type="submit" value="Submit" />
HTML tags in value attributes are interpreted as text, not as HTML:
<input type="submit" value="<i>Submit</i>" />
<%= form.button :submit, class: 'btn btn-success' do %>
<i class="fa fa-plus"></i> Add Funder <i class="fa fa-chevron-right"></i>
<% end %>
This is good answer.
Ok, so I'm working with capybara + rails 3 + rspect
I'm trying to login to my site, but even though I don't get an error when I use the fill_in method, I get an error with the click_on method, since it can't find the element I'm trying to click.
Here is my HTML code:
<form accept-charset="UTF-8" action="/" class="filter_form" id="login" method="post">
<fieldset>
<div class="modal-body">
<div class="clearfix login-fields">
<label for="user_email">Email</label>
<div class="input login-inputs">
<input class="input-text" id="user_email" name="user[email]" placeholder="email" size="30" type="email" value="">
</div>
</div>
<div class="clearfix login-fields">
<label for="user_password">Password</label>
<div class="input login-inputs">
<input class="input-text" id="user_password" name="user[password]" placeholder="password" size="30" type="password">
</div>
</div>
</div>
<div class="modal-footer">
<input class="btn btn-primary login_btn" id="btn_login" name="commit" type="submit" value="Sign in">
Forgot password...
Cancel
</div>
</fieldset>
</form>
And here is the test:
describe "Login ", js: true, type: :request do
it "should login correctly if the right credentials are given" do
Capybara.default_wait_time = 15
Capybara.ignore_hidden_elements = false
visit new_user_session_path
fill_in 'user_email', :with => 'example#test.com'
fill_in 'user_password', :with => 'pwd123'
p page.body
click_on 'Sign in'
visit '/'
save_and_open_page
response.should have_content('Welcome')
end
end
The worst part is that when I do p page.body right before click_on I see the following code:
<html xmlns=\\\"http://www.w3.org/1999/xhtml\\\"><head></head><body></body></html>\
But if I change that for p response.body.inspect then I get the full html code of the page..., shouldn't the visit method load the content of the response on the page?
Any help will be appreciated, this is driving me crazy :)
Add that line:
config.include Capybara::DSL
to spec/spec_helper.rb:
RSpec.configure do |config|
.....
config.include Capybara::DSL
.....
end
To upload a file to a server I'm writing in Clojure I need a client form that looks something like this:
<form action="/file" method="post" enctype="multipart/form-data">
<input name="file" type="file" size="20" />
<input type="submit" name="submit" value="submit" />
However I can't find the documentation for Hiccup or in Compojure to create a form like this. The sample I have looks like this :
[:h2 "Choose a file to upload"]
:form {:method "post" :action "/upload"}
[:input.math {:type "text" :name "a"}] [:span.math " + "]
[:input.math {:type "text" :name "b"}] [:br]
So my question is where is the documentation to find how this should be modified to make a form that will upload a file?
The file upload support for Compojure can be found in the multipart-params Ring middleware. Here's some examples of how to use it:
https://gist.github.com/562624/1df418e4851e68952fc466713f377df2e653afdb
http://www.prodevtips.com/2010/12/19/file-uploads-with-clojure-ring-and-compojure/
Always have a look at Ring middleware documentation, it is full of great code!
Update: Didn't read your question right the first time! To generate a form like this one:
<form action="/file" method="post" enctype="multipart/form-data">
<input name="file" type="file" size="20" />
<input type="submit" name="submit" value="submit" />
</form>
That should do the trick:
[:form {:action "/file" :method "post" :enctype "multipart/form-data"}
[:input {:name "file" :type "file" :size "20"}]
[:input {:type "submit" :name "submit" :value "submit"]]
I've done it from memory, so it's untested.
[:input {:type "submit" :name "submit" :value "submit"]]
Missing }
[:input {:type "submit" :name "submit" :value "submit"]}]