We Keep Coding

Handlebars and node problem getting dynamic list id

I created a for using handlebars to get the values ​​from my bank, the search is coming correctly but when trying to select one of the city options it returns me undefined
I believe it is something in this style, but could not apply in my code
Handlebars & Jquery: Dynamically generated ids
$(document).on("click", "[data-trigger='save']", function (evt) {var commentID = $(this).prev().data("comment");});
{{#each cidade}}
<div class="card mt-4">
<label for="bott"><button class="btn" name="cid" id="cid" data-trigger="save">
<div class="card-body">
<small>{{estado}} - {{ativo}} </small>
<input type="hidden" data-comment ="{{#index}}" name="idcid" id="idcid" value="{{_id}}">
</div>
</button>
</label>
</div>
{{else}}
<h4 value="0">Nenhuma cidade registrada</h4>
{{/each}}
<input type="text" id="cidade" name="cidade" class="form-control" disabled>
The question is to take the id value and the name of the selected button and put the related name in the input text
If you need to add information let me know because I'm new here and I'm using google translator for this conversation
thanks in advance

Why When I click on submit the parameters of the form disappear?

In my google app script, i have an html page with a form whose action attribute is created dynamically based on the input values (with javascript) and i create the action url with parameters. After that i insert some input value , the action url is correctly created (i inspected code), but when i click on submit button , the action url open but without parameters.
i tried with method get, post but i have the some result, new url is opened but without parameter, only with "?" character. But if i do the same procedure with a link and href attribute, it works fine. I noticed that parameter not arrive to doget function
include file index.html and app.gs
<form id="myForm" action="#">
<div class="form-row">
<div class="col">
<input type="text" class="form-control" placeholder="Numero" id="numero">
</div>
<div class="col">
<div class="form-group">
<select id="tipologia" class="form-control">
<option selected>Tipologia supporto</option>
<option >concorsi</option>
</select>
</div>
</div>
</div>
<button type="submit" class="btn-get-started scrollto">Richiedi assistenza Form</button><!--NOT WORK-->
</form>
Richiedi assistenza<!--WORK-->
<script>
document.getElementById("tipologia").addEventListener("change", redirect);
function redirect(){
var nome =document.getElementById("nome").value;
var numero =document.getElementById("numero").value;
var opzioni = document.getElementById("tipologia");
var selezionato = opzioni.options[opzioni.selectedIndex].value;
document.getElementById("btn").href="https://script.google.com/macros/s/AKfycbxia-_rMYlvVjrlyGGd7zRcb1CD5hSYe6W-mLldzxY__8I2b3Q/exec?supporto="+selezionato+"&controllo="+numero+"&nome="+nome;
document.getElementById("myForm").action ="https://script.google.com/macros/s/AKfycbxia-_rMYlvVjrlyGGd7zRcb1CD5hSYe6W-mLldzxY__8I2b3Q/exec?supporto="+selezionato+"&controllo="+numero+"&nome="+nome;
}
</script>
function doGet(e) {
Logger.log(e.parameter.supporto);
var supporto = e.parameter.supporto;
var numero= e.parameter.controllo;
var nome= e.parameter.nome;
}
i don't understand why the parameters disappear

When you submit a form with method="GET" (the default), the URL specified in the action is used as a base.
The query string (which you added using JavaScript) is removed from it and it is replaced with one constructed with the data from the successful form controls.
Since none of your form controls have a name, none are successful, so there is no data. This gives you a blank query string.
Don't try to set the action with JavaScript (which you are doing incorrectly: The DOM action property expects a plain URL, not an HTML encoded one).
Just set the base URL in the action attribute and give the form controls names.
<form id="myForm" action="https://script.google.com/macros/s/AKfycbxia-_rMYlvVjrlyGGd7zRcb1CD5hSYe6W-mLldzxY__8I2b3Q/exec">
<div class="form-row">
<div class="col">
<input type="text" class="form-control" name="controllo" placeholder="Numero" id="numero">
</div>
<div class="col">
<div class="form-group">
<select id="tipologia" name="supporto" class="form-control">
<option selected>Tipologia supporto</option>
<option>concorsi</option>
</select>
</div>
</div>
</div>
<button type="submit" class="btn-get-started scrollto">Richiedi assistenza Form</button>
</form>
NB, your code includes var nome =document.getElementById("nome").value;
but there is no matching id in your HTML. This would cause your JS to error.

Python-requests module, post two "values" to renew&scrape website

The first part was already answered, however, EDIT isn't.
I am using python and the requests module to scrape a website. Therefore I have to “click” a Renew-Button, which is a link(href) wrapped in an image “pat_renewmark.gif”.
html
<form name="checkout_form" method="POST" id="checkout_form">
<input type="HIDDEN" id="checkoutpagecmd">
<a href="#" onclick="return submitCheckout( 'sortByCheckoutDate', 'bycheckoutdate' )">
<img src="/screens/pat_sortbychkout.gif" alt="SORT BY DATE CHECKED OUT" border="0">
</a>
<input type="HIDDEN" name="currentsortorder" value="current_duedate">
<a href="#" onclick="return submitCheckout( 'requestRenewSome', 'requestRenewSome' )">
<img src="/screens/pat_renewmark.gif" alt="RENEW SELECTED ITEMS" border="0">
</a>
</form>
javascript (submitCheckout)
function submitCheckout(buttonname, buttonvalue)
{
var oHiddenID;
oHiddenID = document.getElementById("checkoutpagecmd");
oHiddenID.name = buttonname;
oHiddenID.value = buttonvalue;
//c29364j/c1365070 - prevent the patron from submitting twice
var oButtonSpan;
oButtonSpan = document.getElementById("checkoutbuttons0");
if (oButtonSpan) oButtonSpan.style.display = "none";
oButtonSpan = document.getElementById("checkoutbuttons1");
if (oButtonSpan) oButtonSpan.style.display = "none";
document.getElementById("checkout_form").submit();
return true;
}
Apparently submitCheckout passes .name and value, which are both assigned to ”requestRenewSome”’, to the hidden input with theid=“checkoutpagecmd”`.
I’ve worked with the requests module before and I am able to handle a simple username&password input , for example:
html
<div class="formEntryArea">
<label for="extpatid">
<span class="formLabel">
Your username:
</span>
</label>
<input name="extpatid" id="extpatid" value="" size="20" maxlength="40">
<label for="extpatpw">
<span class="formLabel">
Your password:
</span>
</label>
<input name="extpatpw" id="extpatpw" type="PASSWORD" value="" size="20" maxlength="40">
</div>
python
import requests
with requests.Session() as c:
LOGIN_URL = "https://example.com"
USERNAME = “XXXXX”
PASSWORD = “YYYYY”
source = c.get(LOGIN_URL)
data_load = dict(extpatid=USERNAME,extpatpw=PASSWORD)
head_load = dict(referer=LOGIN_URL)
c.post(LOGIN_URL, data=data_load, headers=head_load)
However, here c.post is handling only one “value” per input (either USERNAME or PASSWORD) and no javascript code is included.
As it seems, for the problem above I somehow have to post the two attributes/strings
.name = 'requestRenewSome'
.value = 'requestRenewSome'
? Or is the approach completely different to the example I attached?
EDIT
The answer from matino (or the comment from t.m.adam) solves the problem! Unfortunately the User then has to approve that he is sure he wants to renew by clicking a YES button.
html
<form name="checkout_form" method="POST" id="checkout_form">
<input type="HIDDEN" id="checkoutpagecmd">
<input type="HIDDEN" name="currentsortorder" value="current_duedate">
<span id="checkoutbuttons0">
<input type="SUBMIT" name="renewsome" value="YES">
<input type="SUBMIT" name="donothing" value="NO">
</span>
</form>
I therefore added 'renewsome': 'YES'to the data_load dictionary, but thats not enough. I don't know the value for the hidden input/s? id=checkoutpagecmd and/or? name=currentsortorder but couldn't find any answer on how to proceed.
P.S. I know it's actually a knew question, and I'm going to separate it, if it's getting answered.

What the javascript code actually does is dynamically assigning name and value to the hidden input. So in the end there can be 2 cases:
<input type="hidden" id="checkoutpagecmd" name="sortByCheckoutDate" value= "bycheckoutdate">
or
<input type="hidden" id="checkoutpagecmd" name="requestRenewSome" value= "requestRenewSome">
Knowing that, you can send http request like this:
requests.post(url, data={'sortByCheckoutDate': 'bycheckoutdate'}) # 1st case
requests.post(url, data={'requestRenewSome': 'requestRenewSome'}) # 2nd case

Angular 4 : How to assign array of string into checkbox in reactive forms

I am trying display checkboxes for my user roles:
For eg. I have two user roles : 1.Admin 2.Employee
I have an array of roles in userObject:
user={
"name":"Bhushan",
"email":"bhushan#yaho.com",
"roles":['Admin','Employee']
}
I want to use reactive form to populate this model into form. I want to populate the roles array into read-only checkboxes i.e. when form loads, user can edit name & email but checkboxes will show admin toggeled if user has admin role or untoggled if he is not an admin. same can be said for employee role.
So far I have tried following:
<form [formGroup]="userForm" (ngSubmit)="onSubmit()" novalidate>
<div style="margin-bottom: 1em">
<button type="submit" [disabled]="userForm.pristine" class="btn btn-success">Save</button>
<button type="reset" (click)="revert()" [disabled]="userForm.pristine" class="btn btn-danger">Revert</button>
</div>
<div class="form-group">
<label class="center-block">Name:
<input class="form-control" formControlName="name">
</label>
</div>
<div class="form-group">
<label class="center-block">Email:
<input class="form-control" formControlName="email">
</label>
</div>
<div class="form-group" *ngFor="let role of roles;let i=index">
<label>
// I tried this, but it doesn't work
<!--<input type="checkbox" [name]="role" [(ngModel)]="role">-->
{{role}}
</label>
</div>
</form>
<p>userForm value: {{ userForm.value | json}}</p>`
Any Inputs?

Perhaps do something like the following. Build your form, and stick the roles in a form array:
this.userForm = this.fb.group({
name: [this.user.name],
roles: this.fb.array(this.user.roles || [])
});
// OPTIONAL: put the different controls in variables
this.nameCtrl = this.userForm.controls.name;
this.rolesCtrl = this.userForm.controls.roles.controls;
and the roles array you are iterating in the template could look like this:
roles = ['Admin', 'Employee','Some role 1', 'Some role 2']
and in your iteration just compare and set the role in roles array as checked in case it matches a value in the form array. Use safe navigation operator, as we know that the roles array is probably longer that the form array, so that an error won't be thrown trying to read an index that doesn't exist:
<div class="form-group" *ngFor="let role of roles;let i=index">
<input [checked]="role == rolesCtrl[i]?.value"
[disabled]="true" type="checkbox">{{role}}
</div>
DEMO

Angularjs- keeps data of nonexistent dom element (ngIf=false)

My form has different fields for each type:
<form>
<select ng-model="message.type">
<option>SMS</option>
<option>Email</option>
</select>
<div ng-if="message.type=='sms'">
<textarea ng-model="message.body"></textarea>
</div>
<div ng-if="message.type=='email'">
<input type="text" ng-model="message.subject" />
<textarea ng-model="message.body" class="ckeditor"></textarea>
</div>
</form>
It works great BUT when the user selects email first, writes something in the subject field, then changes back to sms type, then when I send the message object in $http.post, it sends the object with subject child, even though the dom element was deleted.
How do I fix it? I want to send only the data that is linked to existing dom elements.
Thanks

I can imagine several solutions:
Delete the inappropriate attribute
You can do this when the selected option change:
$scope.deleteInappropriateAttribute = function () {
if ($scope.message.type !== 'email') {
delete $scope.message.subject;
}
};
<select ng-model="message.type" ng-change="deleteInappropriateAttribute()">
<option>SMS</option>
<option>Email</option>
</select>
It's even better to make this action just before you post the form, in order to not force the user to rewrite the message.subject if he's switching frequently between the different options.
Associate a different variable to each part of the form
<form>
<select ng-model="message.type">
<option>SMS</option>
<option>Email</option>
</select>
<div ng-if="message.type=='sms'">
<textarea ng-model="message.global.body"></textarea>
</div>
<div ng-if="message.type=='email'">
<input type="text" ng-model="message.email.subject" />
<textarea ng-model="message.global.body" class="ckeditor"></textarea>
</div>
</form>
And then, only post the appropriate variable:
$http.post(
'myUrl.php',
angular.extend(
{},
$scope.message.global,
$scope.message[$scope.message.type]
)
);