set default values for fields when using skip logic in qualtrics - javascript

If a user selects '1' for Yes, I know how to easily skip the next 5 questions in Qualtrics.
But, I don't just want to apply a logical skip and leave the fields blank. I'd like to autopopulate the skipped fields with a custom value (in my case, a -10). How can I do that?
I see information on display logic...or piping in values...but these aren't what I want. Any help is greatly appreciated.
EDIT: I am starting to suspect I will need to learn Javascript to do this...

There is no way to achieve this natively, instead what you want to do is use JavaScript to hide the questions when your condition is met, select the appropriate answer, and click the next button automatically. Here is a basic template for this:
Qualtrics.SurveyEngine.addOnload(function()
{
var skip = "${e://Field/skip}"; //Set a variable using piped text that can be used to determine whether or not to skip
if(skip == 1){
this.getQuestionContainer().hide(); //Hide the question
//This section is used to set the answer value. Use the Qualtrics JS Question API to determine what you need.
this.setChoiceValueByRecodeValue(1,true);
//End answer setting
$('NextButton').click(); //Click the next button
}
});
Here is a very basic preview using this example.

Related

Is it possible to manually edit data after a dropdown auto-populates the field?

I am the opposite of a code monkey, so please forgive me if this is a simple solution. I have searched and searched and though I've found possible code examples, cannot find any information on how to fix the issue.
I've created a form-fillable PDF. I have fields that calculate based on inputs. I have a dropdown box that auto-populates some of the numbers (to add to the manual inputs). All of these work great!
I thought I would get fancy and further fill some of my data in the form. This is where the problems get funky.
I am setting the fields as shown, but those numbers can no longer be modified afterward.
this.getField("RanksPsy").value = psy;
this.getField("RanksBlade").value = blde;
this.getField("RanksBrawl").value = brwl;
this.getField("RanksCou").value = cou;
this.getField("RanksDip").value = dip;
I have buttons to increase/decrease the Ranks... fields, but the dropdown locks them and I'd like to avoid that if possible.
Is there another way to set those fields without using this.getField?
Thank you.
If I'm honest, I didn't understand the question well 😅
I don't recognize the getField function, so I decided to google it and found a RAD PDF documentation, so I'm assuming that's the library you're using to do this.
As that documentation states,
getFunction gets the first PDF form field object in the loaded
PdfWebControl document with a given name.
And this is the example provided, it may help.
var field = myApi.getField("Test Name");
if(field) {
//set its name to "New Name"
field.setProperties( {"name" : "New Name"} );
}
The solution to this is to put the script as an 'on blur' event rather than a keystroke event. It writes the data and then leaves it alone, which is exactly what I was looking for.

Reset(uncheck) a singular checkbox automatically after it is checked in Javascript

I am trying to add functionality to a checkbox so that when it is checked, it performs a function and then unchecks itself. I only need the function to run once when it is clicked, but if it triggers again on uncheck that is fine. The checkbox is part of a table in a Qualtrics (web surveying platform).
the JavaScript is interwoven with Qualtrics' javascript interface but the trigger event goes something like this. Note: I haven't posted the full code because not all of it is mine and a lot of it is not relevant to the question.
Qualtrics.SurveyEngine.addOnReady(function()
{
this.questionclick = function(event,element){
if(element.type=='checkbox'){
var chkChoice = element.id.split('~');
if (chkChoice[3]==1){
var chkChoice = element.id.split('~');
do something
clear/uncheck the element we just clicked using the following
method
document.getElementById("QR~1_QID69#6~1~3").checked=false;
}
}
}
});
I don't know a whole lot about JavaScript or Qualtrics but if I had to guess its got something to do with the fact that I'm trying to clear the element in which the event was called. If I try to clear another checkbox in that row it will clear it fine so I'm just not sure where to go from here. Do I need a different method to clear the box or should I try calling it by other means or elsewhere in the code.

Setting a dynamic drop down value in JavaScript

I've been working on this issue for days and feel like I'm at a dead end so hoping someone can help out.
I have a form that's used to log calls. The form has two drop downs Reason and Resolution which are created using an array.
When a call is dropped for whatever reason I want the user to click a button called Lost Call and have it fill out the form with specific information.
It works for every field but the Resolution field. I can't get that one to populate.
The lost call button calls a function using onClick.
<Input type="button" value="Lost Call" onClick="LostCall()" />
All my code is HTML5 and JavaScript.
Here is my HTML code:
<select id="Reason"><option value=" "></option></select>
<select id="Resolution"><option value=" "></option></select>
The script I use to create the drop downs I got from here:
http://jsfiddle.net/bdhacker/eRv2W/
Other then changing the Variable names to suit my form and less options the code is the same.
The Question is how can I make it to where someone clicks lost call the form is filled out including the Reason and Resolution with specific values when the Resolution values are dynamically generated?
Here is the script for the Lost Call Button:
function LostCall() {
var Reason = document.getElementById("Reason");
Reason.Value = 'Misc/Other';
var Resolution = document.getElementById("Resolution");
Resolution.Value = 'Lost Call';
Using the above Reason is populated but not Resolution. Also note both Misc/Other and Lost Call are options available in the array I'm using.
EDIT: Updated fiddle.
Hmm, your code is working, as I've tried it in this quick fiddle
Are you simply missing a closing } or was that just a simple mistake when typing this question?
if the value you are assigning in the list of options, try this approach:
function LostCall() {
document.getElementById("Resolution").selectedIndex = "2";
}
check out the following resource (press the "try it yourself" button) : http://www.w3schools.com/jsref/prop_select_selectedindex.asp

Custom action links in .PDF...write Javascript to alter the appearance of links when clicked?

I have a .pdf document that contains custom links which run Javascript code.
There is no issue with the actual functionality of the working portion of the JS, but I do have one formatting/display problem that I havent been able to solve:
Is it possible to write JS that will alter the appearance of individual links as they are clicked?
I know I can programmatically change the appearance of all links on a page by looping through the doc.getLinks result and applying formatting changes to each element of the getLinks array. But I don't know how to refer to a specific link, as/after it's clicked, either by referencing that link's index location within the getLinks array, or by referring to it by any other name, handle, etc.
I would think that this is probably possible to do, but I'm at a loss.
Thanks in advance for any pointers!
EDIT: One thing to clarify...I can do everything I need to do for a single button. That is, I can manually find the button name, and manually enter the JS code to change the appearance of that particular button. To do this, I need to physically look up the name of the button using a few mouse clicks, and then hard code that button's name in my JS getField command. This requires different code for each and every button.
Is it possible to accomplish the same function using the same code for each and every button?
My ultimate objective is to be able to reproduce this function on a series of .pdf files that will, jointly, have thousands of individual buttons. So any manual component of this process will make implementation impractical.
I should have originally phrased the question in terms of, is it possible to write JS code that can automatically detect the name of the button which is calling the code? (ie, how would I implement a self-referential feature for a generic button?)
As wished by the OP…
When a script should refer to the field on which it is running, the field object to use is event.target.
An example:
You have a button which, when clicked, should change the width of the border between 1 and 3. The mouseUp event would containt this piece of code:
if (event.target.lineWidth == 1) {
event.target.lineWidth = 3 ;
} else {
event.target.lineWidth = 1 ;
}
Or another example: when the number in the calculated text field is negative, it should be in red, otherwise in black:
In the Format event of that field, you would add:
if (event.value*1 < 0) {
event.target.textColor = color.red ;
} else {
event.target.textColor = color.black ;
}
And that should give an idea on how to use event.target.

Automatically updating a PHP variable when a radio button or dropdown menu item is selected

My classmates and I are building a small submission form in which a user submits shipping and billing information for their order.
The two main factors that effect the order price are the type of shipping the user selects ( $shippingType ) and the price of the item ( $initialPrice ). The variable $totalPrice is then defined which adds $shippingPrice and $initialPrice.
What we are working towards is having $totalPrice update when $shippingPrice is changed without the user having to resubmit the form. Can this be solved using php? Or would we have to use a jquery event to update the page in realtime.
You'll want to use some sort of jQuery as mentioned above. It's important to understand that PHP is only used either in AJAX, or before the page has loaded. Meaning you cannot use PHP on a page that has already been loaded. To change elements after it's loaded you would need to use javascript/jquery of some sort. I've attached a quick fiddle to illustrate an example of what I think you're looking for.
The gist of it is that you would bind a change event so that when the elements you want to use for mathing are changed you can update the other items.
$('#shipping').bind('focus, change', function() {
//Get the inital value of the #cost input
var initial_val = parseInt($("#cost").val());
//Value from the #shipping input
var additional = parseInt($("#shipping").val());
//Parsed ints because '+' is used for concatination as well, so making the vars ints will make '+' go back to math.
$("#cost").val(initial_val + additional);
});
No it's not the prettiest, but it works.
Here's the Fiddle:
http://jsfiddle.net/Lb486ck8/2/
You will have to use Javascript to accomplish this behavior. Furthermore, you will need to use AJAX (Asynchronous Javascript And XML) to make it work. AJAX is a way for Javascript to send requests to a web page "behind the scenes" while your page stays in the foreground.
http://api.jquery.com/jQuery.post/

Categories