[英]Concatenate user input in Html form and assigning an ID to it, in order to submit in JavaScript
everyone I am newbie to JavaScript and Html and i am trying to concatenate the user input in html form and giving an ID and submit, in order to give command to my controller to act accordingly. 每个人,我都是JavaScript和Html的新手,我正在尝试以html形式连接用户输入并提供ID并提交,以便将命令提供给我的控制器以采取相应的行动。
This is basically setting up schedule for port 1 and command goes like [NORMAL 122(STARTTIMESTOPTIME DAYSESSION)I haven't included session yet. 这基本上是为端口1设置时间表,命令类似于[NORMAL 122(STARTTIMESTOPTIME DAYSESSION),我尚未包含会话。
function Port1_sch_On_off(){
if(connected_flag==1){
client.subscribe("lazy/test");
message = new Paho.MQTT.Message("NORMAL 122 + document.getElementById('port1_timeday'.value)");
message.destinationName = "lazy/test";
client.send(message);
}
else {
console.log("not connected")
}
return false;
}
<tr height=40>
<td><style="text-align:middle">PORT1_SCH_ON_OFF</td>
<td width=40></td>
<td><form id="port1_timeday" oninput="port1_timeday.value = start_time.valueAsNumber start_day.valueAsNumber stop_time.valueAsNumber stop_day ">
<input name="start_time" id="start_time" type="time" min="00:00" max="24:00" required/>
<span class="hours"></span>
<label for="start_day">Day:</label>
<select name="start_day" id="start_day">
<option value="1">MON</option>
<option value="2">TUES</option>
<option value="3">WED</option>
<option value="4">THRUS</option>
<option value="5">FRI</option>
<option value="6">SAT</option>
<option value="0">SUN</option>
</select>
</label>
<input name="stop_time" id="stop_time" type="time" min="00:00" max="24:00" required/>
<label for="stop_day">Day:</label>
<select name="stop_day" id="stop_day">
<option value="1">MON</option>
<option value="2">TUES</option>
<option value="3">WED</option>
<option value="4">THRUS</option>
<option value="5">FRI</option>
<option value="6">SAT</option>
<option value="0">SUN</option>
</select>
</label>
<output name="port1_timeday" for="start_time start_day stop_time stop_day"></output></td>
<input type="button" onclick="Port1_sch_On_off()" value="Port1_timeday">
</form>
</tr>
</table>
And also I have to add eventlistener for the same with which i haven't started yet. 而且我还必须为尚未开始的事件添加事件监听器。
Here are two main ways to concatenate in javascript : 这是在javascript中串联的两种主要方法:
using the + operator : 使用+运算符:
message = new Paho.MQTT.Message("NORMAL 122 " + document.getElementById('port1_timeday'.value));
or 要么
using string interpolation : 使用字符串插值:
message = new Paho.MQTT.Message(`NORMAL 122 + ${document.getElementById('port1_timeday'.value)}`);
I hope this answers your question :D 我希望这能回答您的问题:D
edit 1 : 编辑1:
This function will return your user input cancatenated as such "STARTDAYSTARTTIMESTOPTIMESTOPDAY", you can modify it to return the values in any order : 此函数将返回您的用户输入,例如“ STARTDAYSTARTTIMESTOPTIMESTOPDAY”,您可以对其进行修改以按任意顺序返回值:
function cancat_day_time() {
start_time = document.getElementById("start_time").value;
start_day = document.getElementById("start_day").value;
stop_time = document.getElementById("stop_time").value;
stop_day = document.getElementById("stop_day").value;
return `${start_day}${start_time}${stop_day}${stop_time}`;
}
You can then use it in your function Port1_sch_On_off() like this : 然后可以在函数Port1_sch_On_off()中使用它,如下所示:
function Port1_sch_On_off() {
if (connected_flag == 1) {
client.subscribe("lazy/test");
message = new Paho.MQTT.Message("NORMAL 122 " + cancat_day_time());
message.destinationName = "lazy/test";
client.send(message);
} else {
console.log("not connected")
}
return false;
}
edit 2 : 编辑2:
This is the HTML code that works for me : 这是对我有用的HTML代码:
<tr height=40>
<td></td>
<td width=40></td>
<td>
<form id="port1_timeday" oninput="">
<input name="start_time" id="start_time" type="time" min="00:00" max="24:00" required/>
<span class="hours"></span>
<label for="start_day">Day:</label>
<select name="start_day" id="start_day">
<option value="1">MON</option>
<option value="2">TUES</option>
<option value="3">WED</option>
<option value="4">THRUS</option>
<option value="5">FRI</option>
<option value="6">SAT</option>
<option value="0">SUN</option>
</select>
</label>
<input name="stop_time" id="stop_time" type="time" min="00:00" max="24:00" required/>
<label for="stop_day">Day:</label>
<select name="stop_day" id="stop_day">
<option value="1">MON</option>
<option value="2">TUES</option>
<option value="3">WED</option>
<option value="4">THRUS</option>
<option value="5">FRI</option>
<option value="6">SAT</option>
<option value="0">SUN</option>
</select>
</label>
</td>
<input type="button" onclick="Port1_sch_On_off()" value="Port1_timeday">
</form>
</tr>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.