chgAction in dropdown menu dosent send email. Worked before - javascript

So i've created a form that sends an email to me when you click the "skicka"(send on swedish) button. It works 100% and ive tested it, or rather it worked. Since i have a dropdown menu to change email address/form action it dosent work. I tried using javascript chgAction(), I've also tried different methods but this looked easiest. Somethings wrong but i dont know what since i dont receive any emails anymore. Is this a legitimate way of doing this?
Heres my index.php
NOTE: both kontakt.php and kontakt2.php works since i tried both without beforehand at the form action="".
<?php session_start() ?>
<!DOCTYPE HTML>
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>HS Konsult</title>
<meta name="description" content="" /><meta name="keywords" content="" /><!--[if lte IE 8]><script src="css/ie/html5shiv.js"></script><![endif]--><script src="js/jquery.min.js"></script><script src="js/jquery.scrollex.min.js"></script><script src="js/jquery.scrolly.min.js"></script><script src="js/skel.min.js"></script><script src="js/init.js"></script><noscript>
<link rel="stylesheet" href="css/skel.css" />
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="css/style-xlarge.css" />
</noscript><!--[if lte IE 8]><link rel="stylesheet" href="css/ie/v8.css" /><![endif]--><!--[if lte IE 9]><link rel="stylesheet" href="css/ie/v9.css" /><![endif]-->
</head>
<body><!-- Header -->
<section id="header">
<header class="major">
<h1>HS Konsult</h1>
<p>En Hemsida om oss och vilka tjänster vi erbjuder.</p>
</header>
<div class="container">
<ul class="actions">
<li><a class="button special scrolly" href="#one">Gå Vidare</a></li>
</ul>
</div>
</section>
<!-- Two -->
<section class="main special" id="two">
<div class="container"><span class="image fit primary"><img alt="" src="" /></span>
<div class="content">
<header class="major">
<h2>Vad Gör Vi?</h2>
</header>
<p>Consequat sed ultricies rutrum. Sed adipiscing eu amet interdum lorem blandit vis ac commodo aliquet vulputate.</p>
<ul class="icons-grid">
<li><!--<span class="icon major fa-camera-retro"></span> -->
<h3><img alt="Peo" src="/img.jpg" style="width: 150px; height: 150px;" /></h3>
</li>
<li><!--<span class="icon major fa-pencil"></span> -->
<h3><img alt="Camilla" src="/2.jpg" style="width: 150px; height: 150px;" /></h3>
</li>
<li>
<h3>Camilla</h3>
</li>
<li>
<h3>Peo</h3>
</li>
</ul>
</div>
<a class="goto-next scrolly" href="#three">Next</a></div>
</section>
<!-- Footer -->
<section id="footer">
<div class="container">
<header class="major">
<h2>Kontakta Oss</h2>
</header>
<?php
//tillagd1
//init variables
$cf = array();
$sr = false;
if(isset($_SESSION['cf_returndata'])){
$cf = $_SESSION['cf_returndata'];
$sr = true;
}
?>
<ul id="errors" class="<?php echo ($sr && !$cf['form_ok']) ? 'visible' : ''; ?>">
<?php
if(isset($cf['errors']) && count($cf['errors']) > 0) :
foreach($cf['errors'] as $error) :
?>
<li><?php echo $error ?></li>
<?php
endforeach;
endif;
?>
</ul>
<!--function to run phpfile depending on person selected-->
<script type="application/javascript">
function chgAction() {
console.log('chgAction()');
console.log(form.selectperson.selectedIndex);
if(form.selectperson.selectedIndex=="option1" )
{document.maillista.action = "/kontakt.php";}
else if(form.selectperson.selectedIndex=="option2")
{document.maillista.action = "/kontakt2.php";}
}
</script>
<form id="maillista" name="maillista" action="/" method="post">
<fieldset>
<p>
<label>Välj Person Att Kontakta</label>
<Select class="target"id=selectperson name="selectperson" onChange="javascript:chgAction()">
<option value ="option1">Peo</option>
<option value ="option2">Camilla</option>
</Select>
</p>
<div class="row uniform">
<div class="6u 12u$(xsmall)"><input id="name" name="name" placeholder="Namn" type="text" /></div>
<div class="6u$ 12u$(xsmall)"><input id="email" name="email" placeholder="john.doe#email.com" type="email" /></div>
<div class="12u$"><textarea id="message" name="message" placeholder="Meddelandet måste vara längre än 20 karaktärer." data-minlength="20" rows="4"></textarea></div>
<div class="12u$">
<ul class="actions">
<li><input class="special" type="submit" name="submit" value="Skicka" id="button1"/></li>
</ul>
</div>
</div>
</fieldset>
</form>
<?php unset($_SESSION['cf_returndata']); ?>
</div>
<
<footer>
<ul class="icons"><!-- <li><span class="label">Twitter</span></li>
<li><span class="label">Facebook</span></li>
<li><span class="label">Instagram</span></li>
<li><span class="label">Dribbble</span></li>
<li><span class="label">Email</span></li> -->
</ul>
<ul class="copyright">
<li>© HS</li>
<li>Design:</li>
</ul>
</footer>
</section>
</body>
</html>

Related

How do have my page fill the username and password on an external site?

I am trying to make an HTML page, that when users access, it will take them to a 3rd party external site (I have no control over), and fill in the username and password fields, and log them in.
This is the source of the external site, which I got from my browser.
<!DOCTYPE html>
<html><head>
<title>Omitted | Login</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="text/javascript">
var areActiveModsSelected = false;
var areInactiveModsSelected = false;
function SetActiveSelection()
{
var checkboxes = document.ActiveMods.getElementsByClassName("ModSelection");
areActiveModsSelected = !areActiveModsSelected;
SetSelection(checkboxes, areActiveModsSelected);
}
function SetInactiveSelection()
{
var checkboxes = document.InactiveMods.getElementsByClassName("ModSelection");
areInactiveModsSelected = !areInactiveModsSelected;
SetSelection(checkboxes, areInactiveModsSelected);
}
function SetSelection(checkboxes, isSelected)
{
for(var i=0, n=checkboxes.length;i<n;i++)
{
checkboxes[i].checked = isSelected;
}
}
function checkSavegame()
{
var e = document.getElementById("savegame");
if (e != null) {
var savegame = e.options[e.selectedIndex].text;
var isEmpty = isEmptySavegame(savegame);
document.getElementById("mapSelector").disabled = !isEmpty;
document.getElementById("difficultySelector").disabled = !isEmpty;
}
}
function isEmptySavegame(value)
{
var ret = value.match(/SAVEGAME \d\d* - Empty/g) || value.match(/SPIELSTAND \d\d* - Leer/g) || value.match(/SAUVEGARDE \d\d* - Vide/g);
return ret != null;
}
window.onload = function()
{
checkSavegame();
}
</script>
<link rel="stylesheet" type="text/css" href="css/main.css" />
<link rel="stylesheet" type="text/css" href="css/monitor.css" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<script type="text/javascript" src="js/all.js"></script>
</head>
<body>
<div class="white-bg clearfix">
<header class="main-header" role="banner" data-module="sticky">
<div class="header-bar clearfix"> <div class = "row column"> <div class = "top-bar-right"> <ul class = "menu float-left"><li><a target="_newTwitter" href="https://twitter.com/url"><span class="icon icon-twitter"></span></a></li><li><a target="_newFacebook" href="https://www.facebook.com/giants.farming.simulator"><span class="icon icon-facebook"></span></a></li><li><a target="_newYoutube" href="http://www.youtube.com/user/giantssoftware"><span class="icon icon-youtube"></span></a></li><li><a target="_newGoogleolus" href="https://plus.google.com/109211762279175256996"><span class="icon icon-google"></span></a></li> </ul>
<ul class="dropdown menu float-right"><li class="is-dropdown-submenu-parent is-down-arrow menu-flags"><img src="img/icons/flag-en.png" alt="lang"><ul class="menu submenu is-dropdown-submenu first-sub vertical"><li><img style="border:1px solid #000;" src="img/icons/flag-en.png" alt="English"><span class="country">English</span> <span>(en)</span></li><li><img style="border:1px solid #000;" src="img/icons/flag-de.png" alt="Deutsch"><span class="country">Deutsch</span> <span>(de)</span></li><li><img style="border:1px solid #000;" src="img/icons/flag-fr.png" alt="Francais"><span class="country">Francais</span> <span>(fr)</span></li></ul></li></ul> </div>
</div>
</div>
<div class="top-bar"> <div class="row column"> <div class="top-bar-left"> <img src="img/logo.png"> </div> <div class="top-bar-right"> <ul class="menu float-left"> <li><span>HOME</span></li>
<li><span>SAVEGAMES</span></li>
<li><span>MODS</span></li>
<li><span>JOURNAL</span></li>
<li><div class="status-indicator online"><span>ONLINE</span></div></li></ul></div></div></div></header><section class="content-wrap"><div class="row"> <div class="medium-8 columns">
<img src="template/gsfs.png"><br/><br/><h2>Login to server</h2>
<p>Please enter your login credentials</p>
<div class="row column">
<form name="input" action="index.html?lang=en" method="POST"><div class="table2"><div class="row column table-even"><div class="medium-3 columns column-label">Username</div><div class="medium-9 columns"><input type="text" name="username" value=""></div></div><div class="row column table-odd"><div class="medium-3 columns column-label">Password</div><div class="medium-9 columns"><input type="password" name="password" value=""></div></div><div class="row column table-even text-right">
<input class="button button-form-submit" name="login" type="submit" value="Login"></div></div></form><br />
<h2>Dedicated Server Mobile App (Free)</h2><div><a class="itunesbadge" href="https://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=1135922781&mt=8" style="display:inline-block;overflow:hidden;background:url(https://linkmaker.itunes.apple.com/images/badges/en-us/badge_appstore-lrg.svg) no-repeat;width:135px;height:40px;background-position: center;"></a><a class="googleplaybadge" href="https://play.google.com/store/apps/details?id=com.giantssoftware.fs17_dedi_app" style="margin-left: 5px; display:inline-block;overflow:hidden;background:url(https://play.google.com/intl/en_us/badges/images/apps/en-play-badge-border.png) no-repeat;width:141px;height:40px;background-size: cover;background-position-x: -4px;background-position-y: -3px;"></a></div></div>
</div>
<div class="medium-4 columns">
<div class="social-wrapper">
<div class="social-header clearfix">
<div class="title-wrap clearfix" style="line-height: 62px;">
<i class="icon icon-twitter"></i><span>Twitter</span>
</div>
Follow
</div>
<!-- Load from cache: ../cached/fs17_dedi_twitter_cache_farmingsim_4.json-->
<div class="social-news-block">
<p>RT hi: Come and meet us at E3 at booth West Hall #4512 to learn more about Farming Simulator 19, the next game in the successf…</p>
<span class="post-date">about 1 hour ago</span>
</div>
<div class="social-news-block">
<p>Are you are bale stacking champion? Are you at #blank ? Then show us your skills. The… <a target="_blank" href="blank">nothing</a></p>
<span class="post-date">4 days ago</span>
</div>
<div class="social-news-block">
<span class="post-date">11 days ago</span>
</div>
<div class="social-news-block">
<p>RT #url: We are glad to announce our plans for further expansion by moving to bigger office spaces for our two existing studios…</p>
<span class="post-date">12 days ago</span>
</div>
</div>
</div>
</div>
</section>
<div class="partners clearfix text-center"> <div class="row"> <div class="columns">
<img style="vertical-align:text-top;" src="template/image_11.gif" /> </div> </div> </div> <footer class="main-footer clearfix">
<div class="row">
<div class="medium-8 columns">
<div class="copyright"><img class="copyright__logo" src="img/logos/footer-logo.png"><div>© 2016 GIANTS Software GmbH Alle Rechte vorbehalten.<br>Alle anderen Warenzeichen sind das Eigentum ihrer jeweiligen Besitzer.</div></div> </div>
<div class="medium-4 small-12 columns">
<ul class="menu menu-footer float-right">
<li>7.0.5.0</li>
</ul>
</div>
</div>
</footer>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/frontend.js"></script>
<script>$(document).foundation();</script>
</div>
</body>
</html>
I tried this, but it simply redirects to the page without filling any of the fields.
<DOCTYPE html>
<html>
<head>
<title>TEST</title>
<script>
window.onload = function() {
document.getElementById('loginForm').submit();
};
</script>
</head>
<body>
<form id="loginForm" action="URL of site" method="POST">
<input type=hidden name="username" value="moo"/>
<input type=hidden name="password" value="boo"/>
</form>
</body>
</html>
What is wrong with my code, and how can I achieve my goal?
Thank you.

Write into Firebase Database on the Web

I have a file form.php,
if I enter noting into the form and click the submit button on the web and it write a dictionary into the firebase database successfully,
var dict = {
Name: writeName,
City: "111",
Country: "222",
Address: "333",
};
of course the Name is "".
But if i type something such as "Peter" or something else in the form and click submit button, most if the time it will write nothing into the database.
Please kindly help to solve this issue.
here with the form.php code.
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
<link rel="stylesheet" href="assets/css/main.css" />
<!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
<link rel="shortcut icon" href="images/favicon.png" />
</head>
<body>
<!-- Wrapper -->
<div id="wrapper">
<!-- Header -->
<header id="header">
<div class="inner">
<!-- Logo -->
<a href="" class="logo">
<span class="title"></span>
</a>
</div>
</header>
<!-- Main -->
<div id="main">
<div class="inner">
<header>
</header>
<section>
<form id="form1" name="form1">
<div class="row uniform">
<div class="6u 12u$(xsmall)">
<input type="text" name="ContactName" id="ContactName" value="" required placeholder="公司名字(必填)" />
</div>
<div class="12u$">
<ul class="actions">
<center>
<li><input type="submit" name="submit" id="submit" onClick="submitClick()" class="button special fit" form="form1" value="提交"></li>
<li><input type="reset" class="button special fit" value="Reset" /></li>
</center>
</ul>
</div>
</div>
</form>
</div>
</div>
</section>
</section>
</section>
</div>
</div>
<!--
<footer id="footer">
<div class="inner">
<section>
<h2>Get in touch</h2>
<form method="post" action="#">
<div class="field half first">
<input type="text" name="name" id="name" placeholder="Name" />
</div>
<div class="field half">
<input type="email" name="email" id="email" placeholder="Email" />
</div>
<div class="field">
<textarea name="message" id="message" placeholder="Message"></textarea>
</div>
<ul class="actions">
<li><input type="submit" value="Send" class="special" /></li>
</ul>
</form>
</section>
<section>
<ul class="copyright">
<center><small>© All rights reserved ♥ Grand Production House ♥ Email</small></center>
</ul>
<ul class="icons">
<li><span class="label">Twitter</span></li>
<li><span class="label">Facebook</span></li>
<li><span class="label">Instagram</span></li>
<li><span class="label">Dribbble</span></li>
<li><span class="label">GitHub</span></li>
<li><span class="label">500px</span></li>
<li><span class="label">Phone</span></li>
<li><span class="label">Email</span></li>
</ul>
</section>
</div>
</footer>
-->
</div>
<!-- Scripts -->
<script src="https://www.gstatic.com/firebasejs/4.12.1/firebase.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: "zzzzzzzzzzzzz",
authDomain: "zzzzzzzzzzz",
databaseURL: "zzzzzzzzzzzz",
projectId: "zzzzzzzzzz",
storageBucket: "zzzzzzzzzzzzzzzzzz",
messagingSenderId: "zzzzzzzzzzzzzzzzzz"
};
firebase.initializeApp(config);
</script>
<script>
function submitClick() {
var name = document.getElementById("ContactName");
var writeName = name.value;
var dict = {
Name: writeName,
City: "111",
Country: "222",
Address: "333",
};
firebase.database().ref().child("SUBMIT").push().set(dict);
}
</script>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/skel.min.js"></script>
<script src="assets/js/util.js"></script>
<!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
<script src="assets/js/main.js"></script>
</body>
</html>
Change:
<li><input type="submit" name="submit" id="submit" onClick="submitClick()" class="button special fit" form="form1" value="提交"></li>
to this:
<li><input type="button" name="btn" id="btn" onClick="submitClick()" class="button special fit" form="form1" value="提交"></li>
Also refer to this:
Submit and onclick not working together
onClick didn't work inside form?

Checkbox select JavaScript for displaying required result by backend php

This is my product page
I want to use checkbox for my product page by jquery.. So that customer can easily find their required product with this checkbox . Please do help me as i am in very early stage of jquery.
Thanks in advance
<!DOCTYPE HTML>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7 " lang="sv"><![endif]-->
<!--[if IE 7]><html class="no-js lt-ie9 lt-ie8 ie7" lang="sv"><![endif]-->
<!--[if IE 8]><html class="no-js lt-ie9 ie8" lang="sv"><![endif]-->
<!--[if gt IE 8]> <html class="no-js ie9" lang="sv"><![endif]-->
<html lang="sv">
<script src="assets/js/jquery-1.11.0.min.js"></script>
<body id="rims" class="category category-14 category-falgar hide-right-column lang_sv">
<div id="page">
<div class="columns-container">
<div id="columns" class="container">
<!-- Breadcrumb -->
<div class="breadcrumb clearfix">
<a class="home" href="index.php" title="Återgå till Startsidan"><i class="icon-home"></i></a>
<span class="navigation-pipe" >></span>
<span class="navigation_page">Fälgar</span>
</div>
<!-- /Breadcrumb -->
<div id="slider_row" class="row">
<div id="top_column" class="center_column col-xs-12 col-sm-12"></div>
</div>
<div class="row">
<div id="left_column" class="column col-xs-12 col-sm-3">
<!-- Block layered navigation module -->
<div id="layered_block_left" class="block">
<p class="title_block">Sök Fälgar</p>
<div class="block_content
<form action="#" id="layered_form">
<div>
<div class="layered_filter">
<div class="layered_subtitle_heading">
<span class="layered_subtitle">Storlek</span>
</div>
<ul id="" class="col-lg-12 ">
<?php include 'php/config.php';
$sql =mysql_query("select * from size");
while($row=mysql_fetch_array($sql)){
?>
<li class="nomargin hiddable col-lg-6">
<input type="radio" class="radio" name="size" id="size<?php echo $row['size']?>" value="<?php echo $row['size']?>" />
<label for="layered_id_attribute_group_86">
<?php echo $row['size']?>
</label>
</li>
<?php
}
?>
</ul>
</div>
<div class="layered_filter">
<div class="layered_subtitle_heading">
<span class="layered_subtitle">Bredd</span>
<!--<span class="layered_close">
</span>-->
</div>
<ul id="ul_layered_id_attribute_group_4" class="col-lg-12 layered_filter_ul">
<?php include 'php/config.php';
$sql =mysql_query("select * from width");
while($row=mysql_fetch_array($sql)){
?>
<li class="nomargin hiddable col-lg-6">
<input type="radio" class="radio" name="layered_id_attribute_group_33" id="layered_id_attribute_group_33" value="33_4" />
<label for="layered_id_attribute_group_33">
<?php echo $row['width']?>
</label>
</li>
<?php
}
?>
</ul>
</div>
<div class="layered_filter">
<div class="layered_subtitle_heading">
<span class="layered_subtitle">Bultmönster</span>
<!--<span class="layered_close">
</span>-->
</div>
<ul id="ul_layered_id_attribute_group_2" class="col-lg-12 layered_filter_ul">
<?php include 'php/config.php';
$sql =mysql_query("select * from bolt");
while($row=mysql_fetch_array($sql)){
?>
<li class="nomargin hiddable col-lg-6">
<input type="radio" class="radio" name="layered_id_attribute_group_8" id="layered_id_attribute_group_8" value="8_2" />
<label for="layered_id_attribute_group_8">
<?php echo $row['bolt']?>
</label>
</li>
<?php
}
?>
</ul>
</div>
<div class="layered_filter">
<div class="layered_subtitle_heading">
<span class="layered_subtitle">ET</span>
<!--<span class="layered_close">
</span>-->
</div>
<ul id="ul_layered_id_attribute_group_6" class="col-lg-12 layered_filter_ul">
<?php include 'php/config.php';
$sql =mysql_query("select * from offset");
while($row=mysql_fetch_array($sql)){
?>
<li class="nomargin hiddable col-lg-6">
<input type="radio" class="radio" name="layered_id_attribute_group_205" id="layered_id_attribute_group_205" value="205_6" />
<label for="layered_id_attribute_group_205">
<?php echo $row['offset']?>
</label>
</li>
<?php
}
?>
</ul>
</div>
</div>
<input type="hidden" name="id_category_layered" value="14" />
</form>
</div>
<div id="layered_ajax_loader" style="display: none;">
<p>
<img src="images/loader.gif" alt="" />
<br />Laddar...
</p>
</div>
</div>
<!-- /Block layered navigation module -->
</div>
<!-- Left Panel end -->
<div id="center_column" class="center_column col-xs-9 col-sm-9" >
<h1 class="page-heading product-listing"><span class="cat-name">Fälgar </span>
</h1>
<div class="content_sortPagiBar clearfix">
<div class="sortPagiBar clearfix">
<!-- /Sort products -->
<!-- nbr product/page -->
<!-- /nbr product/page -->
</div>
<div class="top-pagination-content clearfix">
<!-- Pagination -->
<div id="pagination" class="pagination clearfix">
<form class="showall" action="" method="get">
<div>
<input type="hidden" name="id_lang" value="9" />
<input type="hidden" name="id_category" value="14" />
<input type="hidden" name="controller" value="category" />
<input name="n" id="nb_item" class="hidden" value="1098" />
</div>
</form>
</div>
<?php
$sql =mysql_query("select * from items ");
$num_rows = mysql_num_rows($sql);
?>
<div class="product-count">
Visar <?php echo $num_rows; ?> artiklar
</div>
<!-- /Pagination -->
</div>
</div>
<!-- Products list -->
<!--ul-->
<div class="product_list grid row">
<?php
while($row=mysql_fetch_array($sql)){
?>
<!--li-->
<div class="ajax_block_product col-xs-6 col-sm-6 col-md-4 first-in-line first-item-of-tablet-line first-item-of-mobile-line">
<div class="layered" itemscope itemtype="http://schema.org/Product" >
<div class="layered_filter" >
<div class="product-image-container" >
<a class="product_img_link"href="#" title="<?php echo $row['model_name']?> " itemprop="url">
<img class="replace-2x img-responsive" src="admin/itempics/<?php echo $row['itemno']?>.jpg" alt="<?php echo $row['model_name']?> " title="<?php echo $row['cname']?> " width="250" height="250" itemprop="image" />
</a>
<div class="content_price" itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<meta itemprop="priceCurrency" content="SEK" />
</div>
</div>
</div>
<div class="layered_filter">
<h5 itemprop="name">
<a class="product-name" href="#" title="<?php echo $row['model_name']?> " itemprop="url" >
<b><?php echo $row['model_name'], $row['cname'], $row['itemno'], $row['size'], $row['width'], $row['offset'], $row['colour']?></b>
</a>
</h5>
<p class="product-desc" itemprop="description">
<?php echo $row['model_name']?>
</p>
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer" class="content_price">
<span itemprop="price" class="price product-price">
<?php echo $row['price']?> ,00 kr
</span>
<meta itemprop="priceCurrency" content="SEK" />
</div>
<div style="margin-bottom:10px;" class="button-container">
<a class="button ajax_add_to_cart_button btn btn-default" href="index.php?con=8" id="rims_add_cart<?php echo $row['items_id']; ?>" rel="nofollow" title="Lägg till i varukorgen" data-id-product="1338" data-value="<?php echo $row['items_id']; ?>" >
<span>Lägg till i varukorgen</span>
</a>
<a style="margin-top:5px;" itemprop="url" class="button lnk_view btn btn-default" href="index.php?con=11 & itemno=<?php echo $row['items_id']; ?>" title="View">
<span>Mer</span>
</a>
</div>
<div class="product-flags">
</div>
<script>
$("#rims_add_cart<?php echo $row['items_id']; ?>").click(function() {
var addcart = $(this).data('value');
$.ajax({
type: "GET",
url: "session_cart_items.php",
data: {addsessioncart : addcart},
//cache: false,
});
//alert($(this).data('value'));
});
</script>
</div>
<div class="functional-buttons clearfix">
</div>
</div><!-- .product-container> -->
</div><!--li end-->
<?php
}
?>
</div><!--ul end-->
</div>
</div>
</div>
</div>
</div><!-- #center_column -->
</div><!-- .row -->
</div><!-- #columns -->
</div><!-- .columns-container -->
<!-- Footer -->
</div><!-- #page -->
<script type="text/javascript" src="assets/js/jquery.ui.core.min.js"></script>
<script type="text/javascript" src="assets/js/jquery.ui.mouse.min.js"></script>
<script type="text/javascript" src="assets/js/jquery.ui.slider.min.js"></script>
<script type="text/javascript" src="assets/js/jquery.ui.widget.min.js"></script>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script>
$('input[type="checkbox"]').click(function() {
if ($('input[type="checkbox"]:checked').length > 0) {
$('.layered >div').hide();
$('input[type="checkbox"]:checked').each(function() {
$('.layered >div[data-category=' + this.id + ']').show();
});
} else {
$('.layered >div').show();
}
});
</script>
</div>
</body>
</html>
This is my code for the above.. I am using php as backend .

Dynamically added content on template don't respond to Javascript/AJAX/Jquery in CodeIgniter

This is my sample code for the template.
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>WebLAB</title>
<link rel="stylesheet" href="<?php echo base_url()?>assets/css/bootstrap.css" />
</head>
<body class="container">
<header class="panel-heading" role="navigation">
<a class="navbar-brand" href="<?php echo base_url(); ?>">WebLAB</a>
<nav>
<ul class="nav nav-tabs" role="tablist">
<li>Register</li>
<li>About this site</li>
</ul>
</nav>
</header>
<section class="container">
<!--- Dynamic content is loaded here!-->
<?php if(isset($content)) echo $content; ?>
</section>
<footer class="panel-footer text-center">
<span><small>All Rights Reserved | © <?php echo date('Y'); ?> Christ the King College-ICT Team</small></span>
</footer>
<script type="text/javascript" src="<?php echo base_url()?>assets/js/jQuery-1.10.2.js"></script>
<script type="text/javascript" src="<?php echo base_url()?>assets/js/bootstrap.js"></script>
</body>
</html>
This code below is the content I am LOADING to the code above (It's embedding the content dynamically). My problem is that the Javascript code I am trying to apply to an element doesn't respond. I have tried also adding the script on the main page above.
<script type="text/javascript">
$(document).ready(function(){
$('#jq').click(function(){
alert("Hi");
});
});
</script>
<section class="col-md-8">
<p>
<h2 id="jq">Register Your Account here to Login!</h2>
<p>
<article>
<p>
You can only access your account when the admin
approves your request for registration.
</p>
</article>
</section>
<section class="col-md-4">
<form method="post" class="regform" action="<?php echo base_url();?>portal/register" role="form">
<div class="form-group">
<label for="Username" id="sample">Username:</label>
<input type="Username" class="form-control" id="Username" name="username" placeholder="example#mail.com" required>
</div>
<div class="form-group">
<label for="pwd">Password:</label>
<input type="password" class="form-control" id="pwd" name="password" required>
</div>
<div class="form-group">
<label for="pwd">Retype-Password:</label>
<input type="password" class="form-control" id="pwd" name="repassword" required>
</div>
<button type="submit" class="btn btn-default">Register</button>
</form>
</section>
I am using this technique in CodeIgniter 3 controller.
public function registration() {
$data = null;
$data['content'] = $this->load->view('pages/registration', $data, true);
$this->load->view('template/temp_portal.php', $data);
}
Sorry for the messy code. Your help is much appreciated. This is just a sample code BTW.
Your problem is you are using jquery before loading the library. load your JS file including jquery library in your head tag. It will work i.e
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>WebLAB</title>
<link rel="stylesheet" href="<?php echo base_url()?>assets/css/bootstrap.css" />
<script type="text/javascript" src="<?php echo base_url()?>assets/js/jQuery-1.10.2.js"></script>
<script type="text/javascript" src="<?php echo base_url()?>assets/js/bootstrap.js"></script>
</head>
<body class="container">
<header class="panel-heading" role="navigation">
<a class="navbar-brand" href="<?php echo base_url(); ?>">WebLAB</a>
<nav>
<ul class="nav nav-tabs" role="tablist">
<li>Register</li>
<li>About this site</li>
</ul>
</nav>
</header>
<section class="container">
<!--- Dynamic content is loaded here!-->
<?php if(isset($content)) echo $content; ?>
</section>
<footer class="panel-footer text-center">
<span><small>All Rights Reserved | © <?php echo date('Y'); ?> Christ the King College-ICT Team</small></span>
</footer>
</body>
</html>
Try this and check your console what error showing now
Double check your jQuery library link is ok or not

PHP script returns entire webpage instead of database data

Hi I have a wordpress site and I need to get data from a database and input it in a form.
I have the following code:
<?php
/*
Plugin Name: Wordpress Plugin Stijn 1
Description: Een Wordpress plugin die data uit een database haalt en invult via Ajax in een form.
Version: 1.1
Author: Stijn Aerts
Author URI: http://stijnaerts.be
License: GPL2
*/
add_action( 'wp_footer', 'ajax_lookup_userdata' );
function ajax_lookup_userdata(){
if (!is_admin()) {
wp_enqueue_script('jquery');
}
?>
<script type="text/javascript">
jQuery(document).ready(function($){
alert('test');
jQuery('#input_1_2').change(function(){
showUser(this.value);
});
function showUser(str){
if(str==''){
jQuery('#input_1_3').val('niets');
}
jQuery.get("getuser.php", { q: str }, function(response){
jQuery('#input_1_3').val(response);
});
}
});
</script>
<?php
}
?>
and the getuser.php file:
<?php
$q = intval($_GET['q']);
$con = mysqli_connect('localhost',****,****,****);
if (!$con) {
die('Could not connect: ' . mysqli_error($con));
}
mysqli_select_db($con,"ajax_demo");
$sql="SELECT Naam FROM Personeel WHERE personeelsNummer = '1'";
$result = mysqli_query($con,$sql);
return $result
mysqli_close($con);
?>
When I test it I get in the text input the following output:
<!DOCTYPE html>
<!--[if IE 7]><html class="ie ie7" lang="nl-NL"><![endif]-->
<!--[if IE 8]><html class="ie ie8" lang="nl-NL"><![endif]-->
<!--[if !(IE 7) | !(IE 8) ]><!-->
<html lang="nl-NL">
<!--<![endif]-->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<title>Test pagina</title>
<link rel="profile" href="http://gmpg.org/xfn/11">
<link rel="pingback" href="http://test.stijnaerts.be/xmlrpc.php">
<!--[if lt IE 9]> <script src="http://test.stijnaerts.be/wp-content/themes/twentythirteen/js/html5.js"></script> <![endif]-->
<link rel="alternate" type="application/rss+xml" title="Test pagina » Feed" href="http://test.stijnaerts.be/?feed=rss2" />
<link rel="alternate" type="application/rss+xml" title="Test pagina » reacties feed" href="http://test.stijnaerts.be/?feed=comments-rss2" />
<link rel="alternate" type="application/rss+xml" title="Test pagina » Home Reacties feed" href="http://test.stijnaerts.be/?feed=rss2&page_id=2" />
<link rel='stylesheet' id='open-sans-css' href='//fonts.googleapis.com/css?family=Open+Sans%3A300italic%2C400italic%2C600italic%2C300%2C400%2C600&subset=latin%2Clatin-ext&ver=3.9.1' type='text/css' media='all' />
<link rel='stylesheet' id='dashicons-css' href='http://test.stijnaerts.be/wp-includes/css/dashicons.min.css?ver=3.9.1' type='text/css' media='all' />
<link rel='stylesheet' id='admin-bar-css' href='http://test.stijnaerts.be/wp-includes/css/admin-bar.min.css?ver=3.9.1' type='text/css' media='all' />
<link rel='stylesheet' id='twentythirteen-fonts-css' href='//fonts.googleapis.com/css?family=Source+Sans+Pro%3A300%2C400%2C700%2C300italic%2C400italic%2C700italic%7CBitter%3A400%2C700&subset=latin%2Clatin-ext' type='text/css' media='all' />
<link rel='stylesheet' id='genericons-css' href='http://test.stijnaerts.be/wp-content/themes/twentythirteen/fonts/genericons.css?ver=2.09' type='text/css' media='all' />
<link rel='stylesheet' id='twentythirteen-style-css' href='http://test.stijnaerts.be/wp-content/themes/twentythirteen/style.css?ver=2013-07-18' type='text/css' media='all' />
<!--[if lt IE 9]><link rel='stylesheet' id='twentythirteen-ie-css' href='http://test.stijnaerts.be/wp-content/themes/twentythirteen/css/ie.css?ver=2013-07-18' type='text/css' media='all' /><![endif]-->
<script type='text/javascript' src='http://test.stijnaerts.be/wp-includes/js/jquery/jquery.js?ver=1.11.0'></script>
<script type='text/javascript' src='http://test.stijnaerts.be/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://test.stijnaerts.be/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://test.stijnaerts.be/wp-includes/wlwmanifest.xml" />
<link rel='next' title='Contact' href='http://test.stijnaerts.be/?page_id=33' />
<meta name="generator" content="WordPress 3.9.1" />
<link rel='canonical' href='http://test.stijnaerts.be/' />
<link rel='shortlink' href='http://test.stijnaerts.be/' />
<style type="text/css" id="twentythirteen-header-css">
.site-header {
background: url(http://test.stijnaerts.be/wp-content/themes/twentythirteen/images/headers/circle.png) no-repeat scroll top;
background-size: 1600px auto;
}
</style>
<style type="text/css" media="print">
#wpadminbar {
display: none;
}
</style>
<style type="text/css" media="screen">
html {
margin-top: 32px !important;
}
* html body {
margin-top: 32px !important;
}
#media screen and (max-width: 782px) {
html {
margin-top: 46px !important;
}
* html body {
margin-top: 46px !important;
}
}
</style>
</head>
<body class="home page page-id-2 page-template-default logged-in admin-bar no-customize-support single-author">
<div id="page" class="hfeed site">
<header id="masthead" class="site-header" role="banner">
<a class="home-link" href="http://test.stijnaerts.be/" title="Test pagina" rel="home">
<h1 class="site-title">Test pagina</h1>
<h2 class="site-description"></h2>
</a>
<div id="navbar" class="navbar">
<nav id="site-navigation" class="navigation main-navigation" role="navigation">
<h3 class="menu-toggle">Menu</h3> <a class="screen-reader-text skip-link" href="#content" title="Naar de inhoud springen">Naar de inhoud springen</a>
<div class="nav-menu">
<ul>
<li class="page_item page-item-33">Contact
</li>
<li class="page_item page-item-2 current_page_item">Home
</li>
<li class="page_item page-item-41">Registration
</li>
</ul>
</div>
<form role="search" method="get" class="search-form" action="http://test.stijnaerts.be/">
<label> <span class="screen-reader-text">Zoeken naar:</span>
<input type="search" class="search-field" placeholder="Zoeken …" value="" name="s" title="Zoeken naar:" />
</label>
<input type="submit" class="search-submit" value="Zoeken" />
</form>
</nav>
<!-- #site-navigation -->
</div>
<!-- #navbar -->
</header>
<!-- #masthead -->
<div id="main" class="site-main">
<div id="primary" class="content-area">
<div id="content" class="site-content" role="main">
<article id="post-2" class="post-2 page type-page status-publish hentry">
<header class="entry-header">
<h1 class="entry-title">Home</h1>
</header>
<!-- .entry-header -->
<div class="entry-content">
<p> </p>
<p> </p>
</div>
<!-- .entry-content -->
<footer class="entry-meta"> <span class="edit-link"><a class="post-edit-link" href="http://test.stijnaerts.be/wp-admin/post.php?post=2&action=edit">Bewerken</a></span>
</footer>
<!-- .entry-meta -->
</article>
<!-- #post -->
<div id="comments" class="comments-area">
<div id="respond" class="comment-respond">
<h3 id="reply-title" class="comment-reply-title">Geef een reactie <small><a rel="nofollow" id="cancel-comment-reply-link" href="/getuser.php/?q=h#respond" style="display:none;">Reactie annuleren</a></small></h3>
<form action="http://test.stijnaerts.be/wp-comments-post.php" method="post" id="commentform" class="comment-form" novalidate>
<p class="logged-in-as">Ingelogd als admin. Uitloggen?
</p>
<p class="comment-form-comment">
<label for="comment">Reactie</label>
<textarea id="comment" name="comment" cols="45" rows="8" aria-required="true"></textarea>
</p>
<p class="form-allowed-tags">De volgende <abbr title="HyperText Markup Language">HTML</abbr>-tags en -attributen zijn toegestaan: <code><a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> </code>
</p>
<p class="form-submit">
<input name="submit" type="submit" id="submit" value="Reactie plaatsen" />
<input type='hidden' name='comment_post_ID' value='2' id='comment_post_ID' />
<input type='hidden' name='comment_parent' id='comment_parent' value='0' />
</p>
<input type="hidden" id="_wp_unfiltered_html_comment_disabled" name="_wp_unfiltered_html_comment_disabled" value="ff816f89c6" />
<script>
(function() {
if (window === window.parent) {
document.getElementById('_wp_unfiltered_html_comment_disabled').name = '_wp_unfiltered_html_comment';
}
})();
</script>
</form>
</div>
<!-- #respond -->
</div>
<!-- #comments -->
</div>
<!-- #content -->
</div>
<!-- #primary -->
</div>
<!-- #main -->
<footer id="colophon" class="site-footer" role="contentinfo">
<div id="secondary" class="sidebar-container" role="complementary">
<div class="widget-area">
<aside id="search-2" class="widget widget_search">
<form role="search" method="get" class="search-form" action="http://test.stijnaerts.be/">
<label> <span class="screen-reader-text">Zoeken naar:</span>
<input type="search" class="search-field" placeholder="Zoeken …" value="" name="s" title="Zoeken naar:" />
</label>
<input type="submit" class="search-submit" value="Zoeken" />
</form>
</aside>
</div>
<!-- .widget-area -->
</div>
<!-- #secondary -->
<div class="site-info"> Ondersteund door WordPress
</div>
<!-- .site-info -->
</footer>
<!-- #colophon -->
</div>
<!-- #page -->
<script type="text/javascript">
jQuery(document).ready(function($) {
alert('test');
jQuery('#input_1_2').change(function() {
showUser(this.value);
});
function showUser(str) {
if (str == '') {
jQuery('#input_1_3').val('niets');
}
jQuery.get("getuser.php", {
q: str
}, function(response) {
jQuery('#input_1_3').val(response);
});
}
});
</script>
<script type='text/javascript' src='http://test.stijnaerts.be/wp-includes/js/admin-bar.min.js?ver=3.9.1'></script>
<script type='text/javascript' src='http://test.stijnaerts.be/wp-includes/js/comment-reply.min.js?ver=3.9.1'></script>
<script type='text/javascript' src='http://test.stijnaerts.be/wp-includes/js/masonry.min.js?ver=3.1.2'></script>
<script type='text/javascript' src='http://test.stijnaerts.be/wp-includes/js/jquery/jquery.masonry.min.js?ver=3.1.2'></script>
<script type='text/javascript' src='http://test.stijnaerts.be/wp-content/themes/twentythirteen/js/functions.js?ver=2014-03-18'></script>
<script type="text/javascript">
(function() {
var request, b = document.body,
c = 'className',
cs = 'customize-support',
rcs = new RegExp('(^|\\s+)(no-)?' + cs + '(\\s+|$)');
request = true;
b[c] = b[c].replace(rcs, ' ');
b[c] += (window.postMessage && request ? ' ' : ' no-') + cs;
}());
</script>
<div id="wpadminbar" class="nojq nojs" role="navigation"> <a class="screen-reader-shortcut" href="#wp-toolbar" tabindex="1">Spring naar de toolbar</a>
<div class="quicklinks" id="wp-toolbar" role="navigation" aria-label="Topnavigatiebalk." tabindex="0">
<ul id="wp-admin-bar-root-default" class="ab-top-menu">
<li id="wp-admin-bar-wp-logo" class="menupop"><a class="ab-item" aria-haspopup="true" href="http://test.stijnaerts.be/wp-admin/about.php" title="Over WordPress"><span class="ab-icon"></span></a>
<div class="ab-sub-wrapper">
<ul id="wp-admin-bar-wp-logo-default" class="ab-submenu">
<li id="wp-admin-bar-about"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/about.php">Over WordPress</a>
</li>
</ul>
<ul id="wp-admin-bar-wp-logo-external" class="ab-sub-secondary ab-submenu">
<li id="wp-admin-bar-wporg"><a class="ab-item" href="https://nl.wordpress.org/">WordPress.org</a>
</li>
<li id="wp-admin-bar-documentation"><a class="ab-item" href="http://codex.wordpress.org/">Documentatie</a>
</li>
<li id="wp-admin-bar-support-forums"><a class="ab-item" href="https://nl.forums.wordpress.org/">Ondersteuningsforums</a>
</li>
<li id="wp-admin-bar-feedback"><a class="ab-item" href="https://nl.forums.wordpress.org/">Terugkoppeling</a>
</li>
</ul>
</div>
</li>
<li id="wp-admin-bar-site-name" class="menupop"><a class="ab-item" aria-haspopup="true" href="http://test.stijnaerts.be/wp-admin/">Test pagina</a>
<div class="ab-sub-wrapper">
<ul id="wp-admin-bar-site-name-default" class="ab-submenu">
<li id="wp-admin-bar-dashboard"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/">Dashboard</a>
</li>
</ul>
<ul id="wp-admin-bar-appearance" class="ab-submenu">
<li id="wp-admin-bar-themes"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/themes.php">Thema's</a>
</li>
<li id="wp-admin-bar-customize" class="hide-if-no-customize"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/customize.php?url=http%3A%2F%2Ftest.stijnaerts.be%2Fgetuser.php%2F%3Fq%3Dh">Aanpassen</a>
</li>
<li id="wp-admin-bar-widgets"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/widgets.php">Widgets</a>
</li>
<li id="wp-admin-bar-menus"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/nav-menus.php">Menu's</a>
</li>
<li id="wp-admin-bar-header"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/themes.php?page=custom-header">Header</a>
</li>
</ul>
</div>
</li>
<li id="wp-admin-bar-updates"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/update-core.php" title="3 Plugins bijwerken, Vertalingsupdates"><span class="ab-icon"></span><span class="ab-label">4</span><span class="screen-reader-text">3 Plugins bijwerken, Vertalingsupdates</span></a>
</li>
<li id="wp-admin-bar-comments"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/edit-comments.php" title="0 reacties wachten op moderatie"><span class="ab-icon"></span><span id="ab-awaiting-mod" class="ab-label awaiting-mod pending-count count-0">0</span></a>
</li>
<li id="wp-admin-bar-new-content" class="menupop"><a class="ab-item" aria-haspopup="true" href="http://test.stijnaerts.be/wp-admin/post-new.php" title="Toevoegen"><span class="ab-icon"></span><span class="ab-label">Nieuw</span></a>
<div class="ab-sub-wrapper">
<ul id="wp-admin-bar-new-content-default" class="ab-submenu">
<li id="wp-admin-bar-new-post"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/post-new.php">Bericht</a>
</li>
<li id="wp-admin-bar-new-media"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/media-new.php">Media</a>
</li>
<li id="wp-admin-bar-new-link"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/link-add.php">Link</a>
</li>
<li id="wp-admin-bar-new-page"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/post-new.php?post_type=page">Pagina</a>
</li>
<li id="wp-admin-bar-new-user"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/user-new.php">Gebruiker</a>
</li>
</ul>
</div>
</li>
<li id="wp-admin-bar-edit"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/post.php?post=2&action=edit">Pagina bewerken</a>
</li>
</ul>
<ul id="wp-admin-bar-top-secondary" class="ab-top-secondary ab-top-menu">
<li id="wp-admin-bar-search" class="admin-bar-search">
<div class="ab-item ab-empty-item" tabindex="-1">
<form action="http://test.stijnaerts.be/" method="get" id="adminbarsearch">
<input class="adminbar-input" name="s" id="adminbar-search" type="text" value="" maxlength="150" />
<input type="submit" class="adminbar-button" value="Zoeken" />
</form>
</div>
</li>
<li id="wp-admin-bar-my-account" class="menupop with-avatar"><a class="ab-item" aria-haspopup="true" href="http://test.stijnaerts.be/wp-admin/profile.php" title="Mijn account">Hallo, admin<img alt='' src='http://1.gravatar.com/avatar/36a6b3e27a8b5a0a65cc9ce246ca0256?s=26&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D26&r=G' class='avatar avatar-26 photo' height='26' width='26' /></a>
<div class="ab-sub-wrapper">
<ul id="wp-admin-bar-user-actions" class="ab-submenu">
<li id="wp-admin-bar-user-info">
<a class="ab-item" tabindex="-1" href="http://test.stijnaerts.be/wp-admin/profile.php">
<img alt='' src='http://1.gravatar.com/avatar/36a6b3e27a8b5a0a65cc9ce246ca0256?s=64&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D64&r=G' class='avatar avatar-64 photo' height='64' width='64' /><span class='display-name'>admin</span><span class='username'>stijnxk59</span>
</a>
</li>
<li id="wp-admin-bar-edit-profile"><a class="ab-item" href="http://test.stijnaerts.be/wp-admin/profile.php">Mijn profiel wijzigen</a>
</li>
<li id="wp-admin-bar-logout"><a class="ab-item" href="http://test.stijnaerts.be/wp-login.php?action=logout&_wpnonce=8100200395">Uitloggen</a>
</li>
</ul>
</div>
</li>
</ul>
</div> <a class="screen-reader-shortcut" href="http://test.stijnaerts.be/wp-login.php?action=logout&_wpnonce=8100200395">Uitloggen</a>
</div>
</body>
</html>
This is the first time I'm doing a thing like this, especially in Wordpress and I have no clue what is causing this. I just want the script to work! Lol.
Help greatly appreciated.
The first thing I would do is use a browser network inspector to verify exactly what URL is being requested by the $.get() call. Make sure the URL is correct, and load it up in it's own browser tab directly to troubleshoot the getuser.php file. My guess is that the URL is not correct and you're getting a server or WordPress 404 page, hence the HTML in your response. It's probably wisdom to use a full URL in your javascript, because pretty permalinks can cause problems with relative URLs like "getuser.php". Better yet, route your ajax request through WordPress's "admin-ajax.php" endpoint, as it's safer (those requests never get cached by plugins, etc), and use a WordPress action to respond to the request.
Then, as Kevin pointed out, the getuser.php file isn't sending any information to the browser. You'll need to print or echo something to allow javascript to have a response to do anything with. The easiest thing for you to do would be get your database info in array format and then send it to the browser encoded as JSON, using json_encode( $array_of_data ). Then, your javascript code easily work with it as a simple javascript object.

Categories