Changing object data in javascript of a Django/Heroku website - javascript

I'm wondering if it's possible for me to change the values of a data object inside my javascript. The javascript receives postmessages from an iframe and I need to be able to store that information to the correct objects, but I'm not quite sure how to do it on the HTML surface or if it's possible to do in the javascript surface.
I can call
{{ game.high_score}}
in the HTML to fetch the high_score of a certain game object, but my attempts at working out how to have my javascript send values to these objects flies right over my head.
The most recent venture I tried was simply doing
game.gameData.name = somevalue;
in the javascript, but this doesn't seem to change the global value for this data object value (the change is not seen outside of the javascript).
Are there any solid ways of handling this inside/outside of javascript in Django/Heroku environment?
Edit:
I'm not having trouble at grabbing data from POST: The question might as well be as to how I can change a game object's value when the value I want to change it to stems from javascript.
The game class object I have looks something like this:
class GameInstanceDto:
def __init__(self, base: GameIdentityDto, high_score: int, state: str):
self.base = base,
self.high_score = high_score,
self.state = state
if I can call the game specific highscore in the HTML with
{{ game.high_score }}
and I want to alter the value of it in javascript, I personally tried to go with
game.high_score = "2500";
just to see if the value of the high_score would change, but I didn't see it change at all.

I'm not sure if you want to POST the changes back to your model or not so let's take it 1 step at a time.
Alter {{ game.high_score }} with JavaScript
<div id="high_score">{{ game.high_score }}</div>
<script>
var high_score = document.getElementByID('high_score');
high_score.innerHTML = 2500;
</script>
Now, it you actually want to send in back as a POST, make element high_score an input field within a form

Related

How to change an object attribute in JavaScript

I want to change a boolean attribute of an object in JavaScript (the object is from a library called fullPage.js). I want to change the navigation attribute to false, preferably from another file.
Thanks in advance
pretty straight forward. after you create the object just change the value for the key. If you want to do it from a file you have several ways of doing this.
place the object first in local storage
store the object on your backend
place the object as a data element in your html
Show us what you've done so far
let fullpage = {autoscrolling:true,
navagation:true}
console.log(fullpage)
fullpage.navagation = false
console.log(fullpage)

How to pass an array from javascript to php

So i've been asked to remake some registration forms. The way its supposed to work is, that an interpreter chooses X amount of languages in the first select box. Then based on the selections of languages, the user must specify from which languages they can translate from/to.
I want to store this data in a key/value array, with the key being "LanguageFrom" and Value being another array, of "LanguagesTo". This is how i have solved this:
function btnTest() {
var fromArray = $('.freelancerLanguagesFrom').map(function() {
return $(this).val();
}).get();
var toArray = $('.freelancerLanguagesTo').map(function() {
return $(this).val();
}).get();
var tempArray = {};
tempArray[fromArray] = toArray;
}
This method is being called with an "onclick" function in the html part. The user should specify which languages he can translate to for each of the chosen languages in the first box,
I am aware that this probably isn't the ideal approach, but im still an inexperienced developer, and i'd love to hear your take on another approach.
Now comes my problem:
1) How do i make it so the array wont overwrite the existing array with each button click, and instead just add to the array?
2) How do i process this array on the server side (php), so that i can store the values in my database?
3) Is it possible to skip the flow where the user has to press the save(gem) button after each language he has chosen?
edit: Question 1 and 3 are now solved, my only problem is accessing the array i made in js, on the php side
1) tempArray exists only in the scope of the btnTest() function. Declare it outside (in the global scope), initialize it as {} and don't reset it every time you click the button. The way you get the fromArray variable may require some tweaking depending on whether the "from" list can accept a multiple selection or not.
2) Ajax may help. Create a php endpoint to receive the request and call it using ajax. You can work on the array using JSON. Send your data using JSON.stringify(tempArray) and read it using json_decode() in your php script, or simply set the request headers as "application/json" to have it done automatically for you.
3) I personally wouldn't automate this process. Let's say I have 4 languages, Italian, English, French and Chinese.
I have selected a desirable state of languages I can handle:
Italian -> English, French
But I also know how to translate French in Italian so I click, in the from list, French, and I get
French -> English
Which is an undesirable state, for me, because I don't know how to do that. Especially if I were to select many languages, I'd get, inbetween 2 states I want to save, an indefinite amount of states I don't want to save.
If you still want to do so, you need to move the even listener from the button to the list(s), with the onchange event.
I'd also suggest you do your event binding trough jQuery, if you aren't already.
Hope this helped.

Qualtrics: Loop over embedded data fields?

I have a large set of embedded data fields that are called rnd1, rnd2, rnd3 etc. In a certain question block, I stored to each of these a certain value (each a different random number).
I also have a Loop and Merge question block, and in each round, I would like to access the stored data of a different field (i.e. in the 1st round I'd like to access whatever is in rnd1, in the 2nd round access rnd2 etc.) Can this be done in Qualtrics?
I tried something like:
Qualtrics.SurveyEngine.addOnload(function()
{
var trialNum = this.questionId.split('_')[0]; // getting the loop's current round number
var EDname = "rnd"+trialNum; // name of desired EF field
var rndNum = "${e://Field/" + EDname + "}"; // this is where I'd like stored the right ED value
// some more code that uses rndNum
});
but this does not work. It seems that while EDname gets the right string, I cannot access the value of that embedded field this way (though var rndNum = "${e://Field/rnd1} does work and returns the right value, so the problem seems to be in the looping strucutre).
If I cannot loop over the different fields in the JS code for some reason, is there another clever way to get that done in Qualtrics? For example, I thought it may be possible to use the different field names in the Loop and Merge section as "Field 2", but this seem to require me setting manually each and every ED field name.
Thanks.
Piped embedded data fields are resolved on the server before the page gets sent to your browser. So, it is impossible to dynamically create an embedded data field name and resolve it on the client side with JavaScript.
The way you are doing it with a loop & merge field is the best way.

What is the right way to pass data from PHP application to JS?

Let's say i want to open a PHP page and without another request, pass some JSON data directly to the browser, so it will be accessible to my Javascript functions.
I don't know the right way to do it, but what i do currently is something like this :
<textarea id="mydata" style:"display:none">[{code:1,name:'John'},{code:2,name:'Mary'},{code:3,name:'Paul'}]</textarea>
I put the data inside a invisible textarea and now the data inside 'mydata' textarea is accessible by JS doing something like this :
var myData = JSON.parse($('#mydata').val());
Although this works, somehow it does not seem to me the right way to do it... I know i could avoid to 'dirty' the html code by getting the data using Ajax after the page opens, but what i'm trying to do here is avoid more requests, so with only one request, everything will be accessible. Actually in my application i have about 5 textareas like these, so with only 1 request to the server i get all data needed.
Thanks
From PHP's perspective, there is no difference between this:
<textarea id="mydata" style:"display:none">[{code:1,name:'John'},{code:2,name:'Mary'},{code:3,name:'Paul'}]</textarea>
and this:
var myData = [{code:1,name:'John'},{code:2,name:'Mary'},{code:3,name:'Paul'}];
Both of the above take the form of:
[a string][the serialized object][a string]
Whether you're surrounding the values with HTML or with JavaScript, that surrounding decoration is just raw output strings as far as PHP is concerned. So there's no need to add the extra step of outputting the JSON to a form element and then using JavaScript to get the form element's value as a string and parse it back to an object. You can just emit the object itself directly to JavaScript code.

How to update a model field without calling the field explicitly in Javascript

In my MVC3 application, I have a view model that I Json encode so I can manipulate it in JavaScript.
So let's say I have the following code:
var model=#Html.Raw(Json.Encode(Model));
Currently, model.Name has value "Name".
What I want to do now is create another JavaScript object "obj" that has a field called "Value". When you change obj.Value, it also changes model.Name.
So I want something like:
var obj=new Object();
obj.Value=model.Name;
So right now, if I change the value of obj.Value, it doesn't also change model.Name. I want that to happen and I'm not sure how I can do it in JavaScript. How do I do implement that?
Why don't just just put the name in a hidden input field. Change the value with whatever JavaScript you choose in the usual way. Then when the form is posted back you can bind to the name value in the controller action, and set the Model name server-side.
What you are attempting is unnecessarily complicated.
If you really wanted to make it work - then on submit put the entire JSON string in a hidden input field. Then again in the controller action bind to the JSON as a string and deserialize it server-side to reconstruct your Model.

Categories