Question posted in
You can find the official documentation here.

HTML Select Dropdown ID not passing to Javascript Function getelementbyid value is null – Jquery ajax

Novice here, trying to demonstrate the value of client side rest operations to teammates as they rely on scripts and python. Not sure if it’s the fact I’m using numbers for the value attribute or if I’m referencing the getelementbyid wrong. It’s honestly probably none of those things 🙂

I’ve tried to explicitly reference an id assigned to the IP address in the getelementbyid for MakeUrl but it still fails. I also thought for a second it was null becasue it was using the default value but I commented it out and I still got the error.

Error:

Uncaught TypeError: Cannot read property ‘value’ of null (MakUrl Function)

function makeUrl() {
  var ip = document.getElementById("apigatewayip").value;
  return "https://" + ip + "/api/v0/sessions"
};

function createSession(_url) {
  return $.ajax({
    "url": _url,
    "method": "POST",
    "timeout": 0,
    "headers": {
      "Content-Type": "application/json"
    },
    "data": JSON.stringify({
      "gatewayVersion": "1.00.1.15"
    }),
  });
}

createSession(makeUrl());

createSession(makeUrl()).success(function() {

});

<h1>Making AJAX Rest Calls</h1>
<div class="custom-select" style="width:200px;">
  <select name="selectip" id="apigatewayip" onchange="makeUrl">
    <option value="" disabled selected>API Gateway IP</option>
    <option value="169.254.1.10">169.254.1.10</option>
  </select>
  <button onclick="createSession">Submit</button>
</div>
Tags:

2

Answers


  1. 0

    You need to set the handlers to call your function, not just assign:

    <button onclick="createSession()">Submit</button>

    Also, you can just create the url in the createSession function:

    function createSession() {
  var ip = document.getElementById("apigatewayip").value;
  var _url = "https://" + ip + "/api/v0/sessions"
  console.log(_url) // Use this for ajax call
  /*$.ajax({
    "url": _url,
    "method": "POST",
    "timeout": 0,
    "headers": {
      "Content-Type": "application/json"
    },
    "data": JSON.stringify({
      "gatewayVersion": "1.00.1.15"
    }),
  });*/
}
    <h1>Making AJAX Rest Calls</h1>
<div class="custom-select" style="width:200px;">
  <select name="selectip" id="apigatewayip">
    <option value="" disabled selected>API Gateway IP</option>
    <option value="169.254.1.10">169.254.1.10</option>
  </select>
  <button onclick="createSession()">Submit</button>
</div>
    Login or Signup to reply.
  2. 0

    Wait for the document to render using document ready $(function() { }) and use jQuery, don’t mix with legacy JavaScript selection

    Use done callback instead of success

    //Global function 1
function makeUrl() {
    var ip = $("#apigatewayip").val();
    return "https://" + ip + "/api/v0/sessions"
};
//Global function 2
function createSession(_url) {
  return $.ajax({
    "url": _url,
    "method": "POST",
    "timeout": 0,
    "headers": {
      "Content-Type": "application/json"
    },
    "data": JSON.stringify({
      "gatewayVersion": "1.00.1.15"
    }),
  });
}


//Wait until document fully render
$(function() {
   //After document render call the methods
   createSession(makeUrl());

   createSession(makeUrl()).done(function() {

   });
});
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search