I've been struggling with this for a long time and finally have half a solution but not the rest.
Basically, I need Qualtrics respondents to enter a number input into a textbox inline, and I want to store that input as Embedded Data.
So far, in the html of the Qualtrics page, I have
Enter data here: <input type="text" id="myText" value=" ">
<input type="submit" value="Confirm" onclick="formdata()"/>
<script>
function formdata(){
var questionanswer= document.getElementById("myText").value;
Qualtrics.SurveyEngine.setEmbeddedData("Q1input", questionanswer);
}
</script>
This works fine. It creates the text box where they can enter "myText," and then it stores this as Embedded Data Q1input, which I can then access later. However, it's annoying because they have to click this "Confirm" button I created and then leave the page using the normal Qualtrics Next Page button. I did this because I couldn't get it to work at all by running this when the Qualtrics Next Button was clicked, so I had to make it run on my own button.
I've tried to disable the Next Page buttons using the disableNextButton and clickNextButton Qualtrics code, but I don't know where to put it. I can disableNextButton by putting the code in the addOnload portion, but I can't seem to get clickNextButton to run in the formdata function.
Any help would be greatly appreciated! I don't really know JavaScript; I'm just trying to pick this up to run a survey.
The easiest way to handle this is actually just to call your function any time the text entry field changes. Since Qualtrics includes PrototypeJS, you can use the following:
Enter data here: <input type="text" id="myText" value=" ">
<script>
function formdata(){
var questionanswer= document.getElementById("myText").value;
Qualtrics.SurveyEngine.setEmbeddedData("Q1input", questionanswer);
}
$('myText').observe('change', formdata());
</script>
Two thoughts here:
You should be including your script in the JavaScript section of your question, rather than the html edditor. It belongs in the addOnReady Section.
Qualtrics.SurveyEngine.addOnReady(function()
{
function formdata(){
var questionanswer= document.getElementById("myText").value;
Qualtrics.SurveyEngine.setEmbeddedData("Q1input", questionanswer);
}
$('myText').observe('change', formdata());
});
You could achieve the same effect by using a text entry question type in Qualtrics, then using piped-text to add it to the embedded data field in your survey flow.
Related
I'm currently working on a simple page that shows the current time and date. I want to create an input where you can fill in your name, so the page says "Hi there, (your name)"
On previous project I worked with this similar function, I had to create a form and on submit I could get the value. Since this is a very simple page I want to create a simple function, is there actually a way to get the value of the input without creating a form?
See image: Jason is filled in, the input goes away and it says "Hi there, Jason"
That's simple javascript, just select the input and then get its value
var input = document.getElementById('idFromInput');
alert(input.value);
Say you've got a paragraph tag <p id="para">text to replace</p>, and you want to replace the contents of that tag with the contents of a textbox <input type="text" id="textbox" />. You would just write a JS function like the one below, which could be triggered by something like hitting the enter key or a button.
You can expand this to do stuff like putting the textbox in a div and replacing the entire div with the contents of the textbox if you'd like the input field to disappear.
function replacePara() {
let replacementText = document.getElementById("textbox").value;
document.getElementById("para").innerHTML = replacementText;
}
<input type="text" id="textbox" />
<p id="para">text to replace</p>
<button onclick="replacePara()">press me</button>
I have one Text Box (also called "Text Entry") in my qualtrics survey in which I want participants to write something but I do not want to have the result saved in my data. I do not want to use the password function, therefore I have used JavaScript at the Text Box level.
The code below works to the extent that whatever participants put in the Text Box it will be set to an empty string the moment they hit the Next-Button.
Qualtrics.SurveyEngine.addOnload(function()
{
/*Place Your Javascript Below This Line*/
var currentQuestionID = this.getQuestionInfo().QuestionID
var input = $("QR~"+currentQuestionID);
$('NextButton').onclick = function (event) {
input.value = ""
}
});
The problem: This code only works sometimes. For example when I have two textboxes with the exact same code it only works for the first but not the second one. Similarly for some reason if the textbox is embedded in some other questions it doesn't work either.
Does anybody know how I can make this work either by changing my code or with a completely different solution? Essentially, I just want participants to entry some text which will never be saved in my data and I cannot use the password function.
Solution: One way of solving this would be adding a "Descriptive Text" item in which you can add some simple HTML code:
<p>Please provide your email address:</p><p><br></p>
<input name="nothing" type="textarea">
I don't think JavaScript works well in this case as it can't be guaranteed to run before the page has sent the data.
The best way is to make a dummy HTML "question" which has the appearance of a form but does not save any information.
I tried this out in a test survey by adding a question of type "Descriptive Text", and then in "HTML View" for that question, adding:
<p>This is not a real question, there is just a HTML textarea. </p>
<form id="mydummyform">
<input name="nothing" type="textarea" />
</form>
I found that this sometimes showed the HTML source instead of the form in the survey editor; if it does this, just go to "HTML View" and then "Normal View" and it should resolve correctly. This problem was only in the editor -- it always showed correctly in a preview of the survey.
First of all, apologies for the low level of Javascript I'm about to post. I just started playing around with it in my spare time last week to set something up to make my life at work easier.
In a nutshell, I work at a call centre. At the end of each call I have to enter notes into the system. I wanted to create a HTML page where I can simply click a few things and the notes will be ready for me to cut and paste. I'm now playing with drop down menus instead of a billion buttons.
I have a function that is triggered on a button press, which I'd like to then enter text into a textarea based on the selection from a drop down menu. For some reason (that I can't find an answer for), the text appears and then instantly disappears.
Here's my function:
function openCall() {
var callerselection = document.fsnotes.caller.value;
if (callerselection = "CH") {
document.fsnotes.notesentry.value += "CH called ";
}
}
Here's the Form:
<form name="fsnotes">
<textarea rows="8" cols="50" name="notesentry"></textarea>
</br>
<select name="caller">
<option>CH</option>
</select>
<button onClick="openCall()">OK</button>
</form>
Naturally I have a lot more in my main html file, I just have this smaller one to test new ideas in, as a lot of people in my department are now using the one with a billion buttons.
Your button is submitting your form.
Change the button to:
<button onClick="openCall(); return false;">OK</button>
Here's a jsfiddle: http://jsfiddle.net/9m5k5amh/3/
Also see: How to prevent buttons from submitting forms
I'm making a game and I've a html text box, <form> <input> </form> where the users will type in a number and submit it using a html button <button>. How do I get the number using JavaScript so I can use it in my game.js so I'll know how many lives the user want when the submit button is pressed?
I'm not quite sure if this is the correct approach but I was thinking getting the id of the <input> tag and then for the JavaScript part I would use .getElementById of some sort? However, I'm not sure how to incorporate the submit button so that only when it's pressed, I will receive what the user inputted.
Or is there another better way to do this? And if possible, can you provide an example of the codes for doing this?
Let me know if any clarification is needed, thanks!
There are multiple ways to do what you are asking for, one way to do it is as cristian has shown in the comment(using jquery).
In this jsfiddle page I've shown a sample way to do it just using javascript.
The code used in the page is as shown below:
document.getElementById("submit").onclick = function(){
var a = document.getElementById("input").value;
alert("The entered value is: "+a);
}
I have a textbox somewhat like the main google search textbox. When you start typing, the javascript triggers a php script that offers suggestions that you can click on . That part works fine. However, I also want the user to be able to enter text and then just submit it--analagous to rejecting Google's hints and typin in your own search term. Right now, I am trying to do this in html and it is not working. Here is my code:
<form action="mail.php" method="post"><input type="text" name="maddress" size="30" onkeyup="showResult(this.value)"><input type="submit" name="submit" value="Email"></form>
Basically, the javascript within the onkeyup works fine. However, the form is not posting the value in the textbox" to the php script. Perhaps I have a typo somewhat but I can't find it. or maybe the onkeyup is preventing the form from posting...
Would appreciate any suggestions.
showResult() should explicitly return true (or in any case, something non-falsy). Returning false (or a falsy value) from an event handler prevents the default action, in this case, posting the form.
I dont know if this is what you're looking for but if you use the concept of this:
<script type="text/javascript">
function insertText(val,e){
document.getElementById(e).innerHTML+=val;
}
</script>
<textarea id="textIns"></textarea><br />
Insert 'Hello'<br />Insert 'GoodBye'
You can change the 'hello' and 'goodbye' with vars from your php script or where ever you get the items from and it should insert it and allow you to post it.
So just insert this into your function and then it should work. I tested it by adding the textarea in the code to a form and echoing it int he php and i got exactly what was added by the javascript... hope it works. Sorry if it wasn't exactly what you were looking for. The question wasn't to easy to understand because I couldn't see the rest of your source.