Я хочу добавить имя state в моей state mysql table в базе данных, используя PHP и Ajax, но модальное окно не передает информацию. Я разместил весь свой код для отправки по одной кнопке в окне модели:

Моя структура каталогов:

Структура каталогов

Серверные файлы

test.html

 {amp}lt;!DOCTYPE html{amp}gt; {amp}lt;html{amp}gt; {amp}lt;head{amp}gt; {amp}lt;title{amp}gt;Test Page{amp}lt;/title{amp}gt; {amp}lt;link rel="stylesheet" type="text/css" href="./model.css" /{amp}gt; {amp}lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"{amp}gt;{amp}lt;/script{amp}gt; {amp}lt;script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js"{amp}gt; {amp}lt;/script{amp}gt; {amp}lt;/head{amp}gt; {amp}lt;body{amp}gt; {amp}lt;button id="add_state"{amp}gt;Add State{amp}lt;/button{amp}gt; {amp}lt;div{amp}gt; {amp}lt;?php include('server/connection.php'); $sqlSelect="SELECT * FROM tbl_state_info ORDER By StateName ASC"; $result = $conn -{amp}gt; query ($sqlSelect); $result = $conn -{amp}gt; query ($sqlSelect); echo "{amp}lt;select name='StateName'{amp}gt;"; echo "{amp}lt;option{amp}gt;select{amp}lt;/option{amp}gt;"; while ($row = mysqli_fetch_array($result)) { echo "{amp}lt;option value=$row[StateName]{amp}gt; $row[StateName] {amp}lt;/option{amp}gt;"; } echo "{amp}lt;/select{amp}gt;"; ?{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div id="add_state_model" class="add_state_model"{amp}gt; {amp}lt;div class="add_state_model_content"{amp}gt; {amp}lt;span class="state_model_close"{amp}gt;{amp}amp;times;{amp}lt;/span{amp}gt; {amp}lt;form id="state_submit_form" method="post" action=""{amp}gt; {amp}lt;label{amp}gt;Enter State:{amp}lt;/label{amp}gt; {amp}lt;input type="text" name="state"{amp}gt; {amp}lt;input type="submit" name="state_submit"{amp}gt; {amp}lt;/form{amp}gt; {amp}lt;div class="message_box" style="margin-left: 60px;"{amp}gt;{amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;script src="./model.js"{amp}gt;{amp}lt;/script{amp}gt; {amp}lt;/body{amp}gt; {amp}lt;/html{amp}gt; в {amp}lt;!DOCTYPE html{amp}gt; {amp}lt;html{amp}gt; {amp}lt;head{amp}gt; {amp}lt;title{amp}gt;Test Page{amp}lt;/title{amp}gt; {amp}lt;link rel="stylesheet" type="text/css" href="./model.css" /{amp}gt; {amp}lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"{amp}gt;{amp}lt;/script{amp}gt; {amp}lt;script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js"{amp}gt; {amp}lt;/script{amp}gt; {amp}lt;/head{amp}gt; {amp}lt;body{amp}gt; {amp}lt;button id="add_state"{amp}gt;Add State{amp}lt;/button{amp}gt; {amp}lt;div{amp}gt; {amp}lt;?php include('server/connection.php'); $sqlSelect="SELECT * FROM tbl_state_info ORDER By StateName ASC"; $result = $conn -{amp}gt; query ($sqlSelect); $result = $conn -{amp}gt; query ($sqlSelect); echo "{amp}lt;select name='StateName'{amp}gt;"; echo "{amp}lt;option{amp}gt;select{amp}lt;/option{amp}gt;"; while ($row = mysqli_fetch_array($result)) { echo "{amp}lt;option value=$row[StateName]{amp}gt; $row[StateName] {amp}lt;/option{amp}gt;"; } echo "{amp}lt;/select{amp}gt;"; ?{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div id="add_state_model" class="add_state_model"{amp}gt; {amp}lt;div class="add_state_model_content"{amp}gt; {amp}lt;span class="state_model_close"{amp}gt;{amp}amp;times;{amp}lt;/span{amp}gt; {amp}lt;form id="state_submit_form" method="post" action=""{amp}gt; {amp}lt;label{amp}gt;Enter State:{amp}lt;/label{amp}gt; {amp}lt;input type="text" name="state"{amp}gt; {amp}lt;input type="submit" name="state_submit"{amp}gt; {amp}lt;/form{amp}gt; {amp}lt;div class="message_box" style="margin-left: 60px;"{amp}gt;{amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;script src="./model.js"{amp}gt;{amp}lt;/script{amp}gt; {amp}lt;/body{amp}gt; {amp}lt;/html{amp}gt; 

и для бэкэнда я использую JavaScript и PHP

model.js

 var add_state_model = document.getElementById('add_state_model'); var add_state_button = document.getElementById('add_state'); var add_state_span = document.getElementsByClassName('state_model_close')[0]; add_state_button.onclick = function(){ add_state_model.style.display = "block"; } add_state_span.onclick = function(){ add_state_model.style.display = "none"; } window.onclick = function(event) { if (event.target == add_state_model) { add_state_model.style.display = "none"; } } $(document).ready(function(){ var delay = 1000; $('[name="state_submit"]').click(function(e){ e.preventDefault(); var state = $('#state_submit_form').find('[name="state"]').val(); if(state === ''){ $('.message_box').html( '{amp}lt;p{amp}gt;{amp}lt;span style="color:red;"{amp}gt;Please enter state name!{amp}lt;/span{amp}gt;{amp}lt;/p{amp}gt;' ); $('[name="state"]').focus(); return false; } console.log(state); $.ajax({ type: "POST", url: "server/addstate.php", data: {"state":state}, beforeSend: function() { $('.message_box').html( '{amp}lt;img src="./tenor.gif" width="40" height="40"/{amp}gt;' ); }, success: function(data) { setTimeout(function() { $('.message_box').html(data); }, 1000); } }); }); }); 

А также есть страница на сервере addstate.php

 {amp}lt;?php if ( ($_POST['state']!="") ){ $state = $_POST['state']; include('connection.php'); /* check connection */ if ($conn-{amp}gt;connect_errno) { printf("Connect failed: %sn", $conn-{amp}gt;connect_error); exit(); } //insert query for registration $insertSql = "INSERT INTO `tbl_state_info`(`StateName`) VALUES ('$state')"; if ($conn-{amp}gt;query($insertSql) === TRUE) { echo "{amp}lt;span style='color:green;'{amp}gt; {amp}lt;p{amp}gt;State added to dropdown{amp}lt;/p{amp}gt; {amp}lt;/span{amp}gt;"; }else{ printf("Error: %sn", $conn-{amp}gt;error); } } ?{amp}gt; в {amp}lt;?php if ( ($_POST['state']!="") ){ $state = $_POST['state']; include('connection.php'); /* check connection */ if ($conn-{amp}gt;connect_errno) { printf("Connect failed: %sn", $conn-{amp}gt;connect_error); exit(); } //insert query for registration $insertSql = "INSERT INTO `tbl_state_info`(`StateName`) VALUES ('$state')"; if ($conn-{amp}gt;query($insertSql) === TRUE) { echo "{amp}lt;span style='color:green;'{amp}gt; {amp}lt;p{amp}gt;State added to dropdown{amp}lt;/p{amp}gt; {amp}lt;/span{amp}gt;"; }else{ printf("Error: %sn", $conn-{amp}gt;error); } } ?{amp}gt; 

и файл connection.php

 {amp}lt;?php // set the timezone first if(function_exists('date_default_timezone_set')) { date_default_timezone_set("Asia/Kolkata"); } $conn = new mysqli('localhost', 'root', ''); //check connection if($conn-{amp}gt;connect_error){ die("Connection Failed".$conn-{amp}gt;connect_error); } //connect database mysqli_select_db($conn, 'crm'); ?{amp}gt; 

и файл css model.css , он используется для всплывающего окна Model Box

 .add_state_model { display: none; /* Hidden by default */ position: fixed; /* Stay in place */ z-index: 1; /* Sit on top */ left: 0; top: 0; width: 100%; /* Full width */ height: 100%; /* Full height */ overflow: auto; /* Enable scroll if needed */ background-color: rgb(0,0,0); /* Fallback color */ background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ } /* Modal Content/Box */ .add_state_model_content { background-color: #fefefe; margin: 15% auto; /* 15% from the top and centered */ padding: 20px; border: 1px solid #888; width: 30%; /* Could be more or less, depending on screen size */ } /* The Close Button */ .state_model_close { color: #aaa; float: right; font-size: 28px; font-weight: bold; } .state_model_close:hover, .state_model_close:focus { color: black; text-decoration: none; cursor: pointer; } 

Я получаю это ниже ошибка:

ошибка

РИНКУ ЯДАВ

новый участник этого сайта. Будьте внимательны, спрашивая разъяснения, комментируя и отвечая. Проверьте наш

Правила поведения

,

Поправь меня, если я не ошибаюсь

Вы можете посетить этот URL, это поможет вам решить вашу проблему. Как решить ‘Перенаправление заблокировано политикой CORS: нет заголовка’ Access-Control-Allow-Origin ‘?

Или попробуйте изменить путь URL, который я пробовал на моем конце, это работает для меня

  url: "http://localhost/CRM/server/addstate.php", to url: "server/addstate.php" 

введите описание изображения здесь Если какая-либо помощь, не стесняйтесь спрашивать меня

в вашем объекте данных запроса ajax принимайте только объект json, и вы передали строку запроса, попробуйте этот код

 $.ajax({ type: "POST", url: "http://localhost/CRM/server/addstate.php", data: {"state":state}, beforeSend: function() { $('.message_box').html( '{amp}lt;img src="tenor.gif" width="40" height="40"/{amp}gt;' ); }, success: function(data) { setTimeout(function() { $('.message_box').html(data); }, 1000); } }); 

и вторая вещь settimeout принимает задержку в миллисекундах, которые я указал 1 секунду

$('[name="state_submit"]').click(function(e){

Изменить

$('body').on('submit', '#state_submit', function(e) {

также измените свой код AJAX

data: {"state":state},