Home using ajax on php spawned buttons
Reply: 0

using ajax on php spawned buttons

user6316 Published in July 16, 2018, 8:33 pm

Right, I have no idea what to search for in this context, I've tried my hardest to splice together other peoples working code but I just can't get it to work.

I've got an ajax function that sends a request to a php page to load data from a database and then spit it back out on the initial page via $(var).html. The code functions as intended and spawns correct html on the page with all the needed attributes and data, however when I try to use another ajax function to interact with buttons spawned in from the js using their id tag but it wont work at all. Do I need to reload the js file every time data gets spawned in? I'm at quite a mess right now so any help would be appreciated. I'll post all the relevant code in for people to browse. Apologies if it's all a bit messy, it's a work in progress.

This is my Index.php file, it's very basic as it only needs to hold the login form and the rest of the site functions handle the rest.

<!DOCTYPE html>
<html lang="en">

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="main/login.js"></script>
  <script src="main/dashHandler.js"></script>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Particles Login</title>
  <link rel="stylesheet" href="style.css">

  <div id="particles-js">
    <div id="login">
      <form action="./" method="post">
          <label for="username">Username</label>
          <input type="text" placeholder="Username" name="name" id="name">

          <label for="password">Password</label>
          <input type="text" placeholder="Password" name="word" id="word">
        <input type="submit" value="Login" id="loginbtn">
        <div class-"err" id="add_err"></div>
    <div class="dash" id="dashboard">
        <div class="dash" id="dashboardContent">

        <div id="output">


  <script src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>

    particlesJS.load('particles-js', 'particles.json', function(){
      console.log('particles.json loaded...');


This is the PHP that spawns the data I'm after, I want to be able to interact with certain buttons that the PHP spawns in.


    $path = $_SERVER['DOCUMENT_ROOT'];
    $path .= "/main/config.php";

$user = $_POST['uname'];

$sql = "SELECT siteID, sitePath, siteOwner, siteName, siteCreation FROM sites WHERE siteOwner LIKE '{$user}'";
$result = $conn->query($sql);

if ($result->num_rows > 0) {while($row = $result->fetch_assoc()){
$id = $row["siteID"];
$path = $row["sitePath"];
$owner = $row["siteOwner"];
$name = $row["siteName"];
$creation = $row["siteCreation"];

        <li class="lidata">'.$name.'</li>
        <li class="libtn">goto</li>
        <li class="libtn">clone</li>
        <li class="libtn" id="del" value="' . $path . '">Delete ' . $path . '</li>

}}else{echo "something died";}


This is my Javascript file, it handles the login function as well as interacting with the spawned in button.

// JavaScript Document
var username, password, bigman;

    $("#add_err").css('display', 'none', 'important');
    $("#dashboard").css('display', 'none', 'important');
           type: "POST",
           url: "main/loginHandle.php",
            data: "uname="+username+"&pword="+password,
           success: function(html){  
           //this html passthrough variable is awesome, using fnc(var) gives you whatever shit the called php echos back, insanely useful for seamless passthrough :D migecki mageck  
            if(html=='true')    {


                    //$("#add_err").html("right username or password");
                    $("#add_err").css('display', 'none', 'important');
                    $("#dashboard").css('display', 'inline', 'important');

                            $("#dashboard").css('display', 'inline', 'important');
                            //$("#dashboard").html("<img src='main/Assets/load.gif' /> Loading...");


            else    {
            $("#add_err").css('display', 'inline', 'important');
             $("#add_err").html("<img src='main/Assets/alert.png' />Wrong username or password");
            $("#add_err").css('display', 'inline', 'important');
            $("#add_err").html("<img src='main/Assets/load.gif' /> Loading...");
        return false;



        $("#add_err").css('display', 'inline', 'important');
        $("#add_err").html("<img src='main/Assets/alert.png' />Wrong username or password");




If any more information is needed feel free to ask, I might have explained this terribly but hopefully my code will help it make sense.

You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.317378 second(s) , Gzip On .

© 2016 Powered by mzan.com design MATCHINFO