Pass Javascript Variable into an Input text

4

In this code, I need to pass the variable Var url_atual into

As I'm not aware of javascript I would like a little help on how I can do this

function loginMeuSite() {
var url_atual = window.location.href;
var divLoginSite = document.getElementById("divLoginSite");

divLoginSite.innerHTML = 
'<form action="logar2.php" method="post">'+
'<input type="text" name="urlnome"  value="url_atual">'+
'<input type="hidden" name="ip"  value="">'+
'<input type="text"     name="cod" style="width: 30%;" size="50" maxlength="50" placeholder="Codigo">'+
'&nbsp;'+
'<input type="text"     name="login" style="width: 30%;" size="50" maxlength="50" placeholder="Login">'+
'&nbsp;'+
'<input type="password" name="senha" style="width: 15%;" size="12" maxlength="12" placeholder="Senha">'+
'&nbsp;'+
'<input type="submit" value="Logar"></form>';
}
document.addEventListener("DOMContentLoaded", function(event) {    
loginMeuSite(); });
    
asked by anonymous 08.10.2015 / 22:11

3 answers

5

To concatenate this variable you must use the concatenation symbol, which in JavaScript is + .

So you can use it like this:

'<input type="text" name="urlnome"  value="' + url_atual +'">'
    
08.10.2015 / 22:13
3

Just do this, so the variable is preserved in the script, but I recommend you improve this as it's pretty bad:

function loginMeuSite() {
var url_atual = window.location.href;
var divLoginSite = document.getElementById("divLoginSite");

divLoginSite.innerHTML = 
'<form action="logar2.php" method="post">'+
'<input type="text" name="urlnome"  value="'+url_atual+'">'+
'<input type="hidden" name="ip"  value="">'+
'<input type="text"     name="cod" style="width: 30%;" size="50" maxlength="50" placeholder="Codigo">'+
'&nbsp;'+
'<input type="text"     name="login" style="width: 30%;" size="50" maxlength="50" placeholder="Login">'+
'&nbsp;'+
'<input type="password" name="senha" style="width: 15%;" size="12" maxlength="12" placeholder="Senha">'+
'&nbsp;'+
'<input type="submit" value="Logar"></form>';
}
document.addEventListener("DOMContentLoaded", function(event) {    
loginMeuSite(); });

Another interesting way to do this would be:

function loginMeuSite() {

  var self = this;

   self.addEvent = function(url, id) {
      self.id = id;
      self.url_atual = url; 
       document.addEventListener("DOMContentLoaded", function(event) {   
           document.getElementById(self.id).innerHTML = self.createForm();
      });
   };     

  self.createForm = function() {
          var url_form = 'logar2.php';
          var id='login_f';
          var metodo = 'post'; 
          var inputs = [];
          var arrElements = [
                               {
                               type:"text",
                               name:"urlnome",
                               style:"width: 30%",
                               size: null,
                               value: self.url_atual,
                               maxlength:null,
                               placeholder:"URL"
                               },
                               {
                               type:"hidden",
                               name:"ip",
                               style:null,
                               size: null,
                               value: "",
                               maxlength:null,
                               placeholder:null
                               },
                               {
                               type:"text",
                               name:"cod",
                               style:"width: 30%",
                               size: 50, 
                               value: "",
                               maxlength:50,
                               placeholder:"Código"
                               },
                               {
                                type:"text",
                                name:"login",
                                style:"width: 30%",
                                size: 50,
                                value: "",
                                maxlength:50,
                                placeholder:"Login"
                               },
                               {
                                type:"password",
                                name:"senha",
                                style:"width: 15%",
                                size: 12,
                                value: "",
                                maxlength:12,
                                placeholder:"Senha"
                               },
                               {
                                type:"submit",
                                name:"envio",
                                style:null,
                                size: null,
                                value: "Logar",
                                maxlength:null,
                                placeholder:null
                               }
                            ];
          for (var i in arrElements) {

                 var type  = (arrElements[i].type != null) ? 'type="'+arrElements[i].type+'"' : null;
                 var name  = (arrElements[i].name != null) ? 'name="'+arrElements[i].name+'"' : null;
                 var style = (arrElements[i].style != null) ? 'style="'+arrElements[i].style+'"' : null;
                 var size  = (arrElements[i].size != null) ? 'size="'+arrElements[i].size+'"' : null;
                 var value = (arrElements[i].value != null) ? 'value="'+arrElements[i].value+'"' : null;
                 var max   = (arrElements[i].maxlength != null) ? 'maxlength="'+arrElements[i].maxlength+'"' : null;
                 var place = (arrElements[i].placeholder != null) ? 'placeholder="'+arrElements[i].placeholder+'"' : null;
               inputs.push(['<input',type,name,style,size,value,max,place,'>'].join(""));
          }
          return ['<form action="',url_form,'" id="',id,'" method="',metodo,'">', 
                                             inputs.join("&nbsp;\n"),
                                           '</form>'].join("\n");
     }


    }
  var addLogin = new loginMeuSite();
      addLogin.addEvent(window.location.href, "divLoginSite");
    
08.10.2015 / 22:14
2

That also works.

  var divLoginSite = document.getElementById("divLoginSite").innerHTML = window.location.href;
    
08.10.2015 / 22:21