Hi I'm trying to create a reset button for this temperature widget. I want to click the button and have the input box be cleared. Right now, when I click, no matter what I do, the input in the text box doesn't go away.
Here is my code:
(ns learn-cljs.temp-converter
(:require
[goog.dom :as gdom]
[goog.events :as gevents]))
(defn f->c [deg-f]
(/ (- deg-f 32) 1.8))
(defn c->f [deg-c]
(+ (* deg-c 1.8) 32))
(def celsius-radio (gdom/getElement "unit-c"))
(def fahrenheit-radio (gdom/getElement "unit-f"))
(def temp-input (gdom/getElement "temp"))
(def output-target (gdom/getElement "temp-out"))
(def output-unit-target (gdom/getElement "unit-out"))
(def reset-button (gdom/getElement "reset-button"))
(defn get-input-unit []
(if (.-checked celsius-radio)
:celsius
:fahrenheit))
(defn get-input-temp []
(js/parseInt (.-value temp-input)))
(defn set-output-temp [temp]
(gdom/setTextContent output-target
(.toFixed temp 2)))
;; 5 event handling callback
(defn update-output [_]
(if (= :celsius (get-input-unit))
(do (set-output-temp (c->f (get-input-temp)))
(gdom/setTextContent output-unit-target "F"))
(do (set-output-temp (f->c (get-input-temp)))
(gdom/setTextContent output-unit-target "C"))))
(defn reset-temp [_]
(gdom/setTextContent temp-input ""))
;; 6 attach event handlers
(gevents/listen temp-input "keyup" update-output)
(gevents/listen celsius-radio "click" update-output)
(gevents/listen fahrenheit-radio "click" update-output)
(gevents/listen reset-button "click" reset-temp)
In my index.html file I have:
<div>
<input type="reset" id="reset-button">
</div>
I can't for the life of me get this button to work? What do I do?
This is based on an exercise in the learn-clojurescript book, but I don't know where to find any answers for this.
I figured it out. In my index.html I changed it to this:
<form>
<div class="temp-control"> <!-- 2 -->
<label for="temp">Temperature:</label>
<input type="number" id="temp" name="temp" />
<input type="reset" value="Reset">
</div>
</form>
</div>
Related
My code works well in REPL, but it does not get the second value in my web application.
eg (?vehicle=bike&vehicle=car)
what I tried
when I do
CL-USER> (setf |vehicle| '(a b c)
CL-USER>
(let ((|vehicle| (multival-plist:getf-all `(:|vehicle| ,|vehicle|) :|vehicle|)))
(print (alexandria:flatten (list :vehicle |vehicle|))))
which result the desired output (:VEHICLE A B C)
but when I submit my form
<form action="/checkbox">
<input type="checkbox" name="vehicle" value="bike"> I have a bike<br>
<input type="checkbox" name="vehicle" value="car"> I have a car<br>
<input type="submit" value="Submit">
</form>
to my route
#route GET "/checkbox"
(lambda (&key |vehicle|)
(let ((|vehicle| (multival-plist:getf-all `(:|vehicle| ,|vehicle|) :|vehicle|)))
(format nil "~a" (list :vehicle (alexandria:flatten |vehicle|)))))
actually I render the result to djula template, but for testing I use format instead.
<ul>
{% for a in vehicle %}
<li>{{ a }}</li>
{% endfor %}
</ul>
it resulted only (VEHICLE (bike)) even two of them checked, resulting in
bike
what I expect to happen
the output should
bike
car
I will use 16 checkboxes in my app, this will result to very long link, any suggestion to make the link short.
PS: I use Hunchentoot server and Caveman2 web framework.
change name=vehicle to name=vehicle[] in the html and caveman2 will parse this as a list of values giving the list ("bike" "car") when both checked as the value of vehicle.
I have a submit button with text and I want to check for both.
i.e. the actual page has:
<input class="button" type="submit" value="Continue" tabindex="3"
name="nav[save]"></input>`
So I've tried
it "I can see the Continue button" do
expect(page.find('input[type="submit"]').find('input[value="Continue"]')).to be
end
but I get
Unable to find css "input[value=\"Continue\"]"
and
expect(page.find('input[type="submit"]')).
to have_selector('input[value="Continue"]')
but I get
expected to find css "input[value=\"Continue\"]" but there were no matches
If you want to check for both you can do it in single css selector like
input[type=\"submit\"][value=\"Continue\"]
Here's one solution that works with your view:
expect(find('.button').value).to eq 'Continue'
In the console:
[1] pry(#<Cucumber::Rails::World>)> expect(find('.button').value).to eq 'Continue'
=> true
I am newbie to asp.net . I learned that only one server side form could be used on a page. So.. due to functional requirement I have to create multiple forms . I did it with normal forms (without runat="server" tag . I used while loop to create form. Counter is initialized to zero & incremented to a particular length. But after running page I found by viewing source on browser that first form tag was not there (that is made on counter value 0) and other forms were there (counter value greater than zero). For reference I am including my code
<%
int length = 0;
while (postListLength > length)
{ %>
<div class="View-Posts">
<div class="View-Post-Content">
<%=postList[length].PostContent %><br />
<form method="post" action="CompletePost.aspx">
<input type="hidden" name="RequestedId" value="<%=postList[length].PostId.ToString()%>" />
<input type="submit" value="See More" />
</form>
</div>
</div>
<%
length++;
}
%>
Then I made another asp page without loop only one form there also I got the same problem.
But the inner content of form is there like textbox etc. only form tag is not there for first form
Any help will be appreciable
I am writing a selenium test with capybara and trying to fill out a pop-up box. I am not able to fill in the name of the element using fill_in method in capybara. This works perfectly fine with other forms in other pages but not on this one.
Here is my test code:
describe "Jobs" do
before do
login(users(:admin))
end
it "creates a job on a workspace" do
visit('#/workspaces')
click_button "Create Workspace"
within_modal do
fill_in 'name', :with => "testing-jobs"
click_button "Create Workspace"
end
click_link "Dismiss the workspace quick start guide"
page.should have_content('All Activity')
Workspace.find_by_name("testing-jobs").should_not be_nil
click_link "Jobs"
click_button "Create"
within('#facebox') do
find(".name").click
fill_in '. name', :with => "real job"
choose "onDemand"
click_button "Create"
end
page.should have_content "real job"
end
end
The first fill_in with respect to workspace works really fine but when I get to the jobs it just screws up.
Here is the actual dev code from firebug:
<div id="facebox" class="dialog_facebox" style="top: 30px; left: 424.5px;">
<div class="popup" style="max-height: 626px;">
<div class="content">
<div class="configure_job_dialog dialog">
<div class="dialog_header">
<div class="errors"></div>
<div class="dialog_content" data-template="configure_job_dialog">
<form action="#">
<label class="required">Name</label>
<input class="name" type="text" value="">
I am using the name class in the fill_in method but capybara is not catching it. I tried to debug a little more to see why my workspace gets created but not the job. The workspace code is as follows.
<input type="text" maxlength="256" tabindex="1" placeholder="Name this workspace" name="name">
Any help is highly appreciated.
Problem
Based on the html given, you will not be able to use the fill_in method. The reasons are that:
The fill_in method locates elements based on their id attribute, name attribute or label text. It does not support locating elements by a CSS-selector, which .name is.
The element does not have an id or name attribute and therefore cannot be used by fill_in. As well, the label is not directly associated with the input via for and id attributes. I believe fill_in only checks explicit labels (rather than implicit labels).
Note that the fill_in works for the workspace because that input has a name attribute specified.
Solution
The ideal solution would be to update the input to have an id attribute, name attribute or explicit label. However, if that is not possible or if you need to use the CSS-selector, you can find the element and then set the value:
find('.name').set("real job")
We're seeing very strange Meteor behavior. After a simple event hook is executed (which gathers info from a form, executes an insert and updates a Session variable), the client seems to startup again, redrawing the entire page. In effect, Meteor.startup is being executed more than once, even though the browser window is not being refreshed (or anything like that). Even stranger is the fact that we've made extremely similar apps, but they don't display this behavior at all. We cannot detect any significant differences between the different projects.
We're using Meteor version 0.6.4.1 (in all cases), both autopublish and insecure have been removed.
Playlist.html:
<body>
{{> addSong}}
{{> playlist}}
</body>
<template name="addSong">
<form>
<fieldset>
<legend>Add a song to the playlist!</legend>
<div><input type="text" id="artist" /></div>
<div><input type="text" id="title" /></div>
<div><button type="submit" id="insertButton">Insert</button></div>
</fieldset>
</form>
</template>
<template name="playlist">
<div>Votes left: {{votes}}</div>
<ul>
{{#each songs}}
<li>
{{artist}} - {{title}} - {{score}}
<button class="voteUp" mongo_id="{{_id}}">Vote up!</button>
<button class="remove" mongo_id="{{_id}}">X</button>
</li>
{{/each}}
</ul>
</template>
lib/common.coffee
#Songs = new Meteor.Collection "songs"
Songs.allow
insert: (userID) ->
true
update: (userID) ->
true
remove: (userID) ->
true
client/client.coffee
Meteor.subscribe "songs"
Template.playlist.songs = ->
Songs.find {},{sort:{"score":-1}}
Template.playlist.votes = -> Session.get("votes")
Template.addSong.events
'click #insertButton': (event,template) ->
artist = template.find("#artist").value
title = template.find("#title").value
Songs.insert({"artist":artist,"title":title,"score":1})
votes = Session.get("votes")
Session.set "votes", votes+3
return
Template.playlist.events
'click .voteUp': (event,template) ->
id = event.target.attributes.mongo_id.value
Songs.update({_id:id},{$inc:{"score":1}})
'click .remove': (event,template) ->
id = event.target.attributes.mongo_id.value
Songs.remove({_id:id})
Meteor.startup ->
alert "Starting"
Session.setDefault "votes", 0
server/server.coffee
Meteor.publish "songs", -> Songs.find({})
To replicate the weird behavior, just submit items on the form, this triggers a startup every time (verified in Chrome as well as Safari).
If you have the code on github, I can help to look at it, but with just your description, it's hard to say what the problem would be...
OK. We've found out what the problem is. The <form> tag, in combination with a submit button caused the client to execute a HTTP POST, which cause the entire page to re-render.
It's a very subtle problem and quite hard to detect, but the lesson here is that you shouldn't use <form> tags unless you are absolutely certain. Some kind of mechanism/warning/documentation might be a good idea to prevent this from happening to other people.