Search the Community
Showing results for tags 'Jquery'.
-
I am playing with a simple example where I have a 2 pages Working code in Plunker One page is a simple Form page. That uses jQuery submit() to fire up an alert ("yayyy for summitted") when the form is submitted. Page two, places this form in an iframe and loads it into a jQuery Dialog that has a SAVE and CLOSE button I want to be able to trigger the form Submit using the SAVE BUTTON in the Dialog. Since the form is in a iframe, I have no idea how to successfully fire up that alert ("yayyy for summitted"). Been stuck on this for a couple of days. So some help would be nice, thanks... Dialog Page <!DOCTYPE html> <html> <head> <title>iframe in Dialog</title> <link rel="Stylesheet" type="text/css" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" /> <script type="text/javascript" src="https://code.jquery.com/jquery-3.6.0.min.js"> </script> <script type="text/javascript" src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"> </script> <script type="text/javascript"> $(document).ready(function () { $('a#pop').on('click', function (e) { e.preventDefault(); var pagetitle = $(this).attr("title") var page = $(this).attr("href") var iframe = $('<iframe id="myiframe2" style="background:#EEE9E7; border: 0px; " src="' + page + '" width="100%" ' + 'height="100%"></iframe>'); var dialog1 = $('<div></div>').append(iframe).appendTo('body').dialog({ autoOpen: false, modal: false, height: 625, width: 500, title: pagetitle, close: function (e, ui) { alert('pressed'); $(this).remove(); }, buttons: { "Save": function () { alert('Dialog SAVE pressed but for has not yet been subbmitted'); var commentForm = '#commentForm'; var iFrameDOM = $("iframe#myiframe2").contents(); // NOT WORKING iFrameDOM.contents().find('form').submit(); }, "Close": function () { $(this).dialog("close"); } } }); dialog1.dialog('open'); }); }); </script> </head> <body> <!-- Form Page must reside in same domain --> <br /><br /><a id="pop" href="http://localhost/test/formtest" title="Hello World!!!">click me for the Form</a> </body> </html> Form Page <!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"> </script> <script> $(document).ready(function(){ $('#commentForm').submit(function(e){ e.preventDefault(); alert("yayyy for summitted"); console.log("submitted"); }); //$("form").submit(function(){ // alert("form is submitted."); //}); }); </script> </head> <body> <h2>A very Simple Forrm</h2> <p>On Submit we use jQuery submit() Method and pop up an alert</p> <form id="commentForm" name='commentForm' method="get" action="/"> Your Name: <input type="text" name="name" value="Santa Clause"><br> Your Age: <input type="text" name="age" value="35"><br><br> <input type="submit" name="submit" id="mybutton" value="Submit"> </form> </body> </html>
-
jquery Passing data to database after jQuery form validation
DatruthDee posted a topic in Javascript
Hello everyone I wanted you all to look at this jQuery code to see how can I pass the data to the php file after the validation. form.js -
I have large xml file with different products. I want to show products on html format via parsing it using jquery or any server side technologies. Once this is parsed and displayed, when I click on particular node, it select that and display selected node value with highlight. Please let me know if any help or online resources available to do it. Thank you
-
Hi, I have recently added two jquery scripts into my personal website, in the process learning how it works. The first script was responsiveslides, which I managed to work in its most basic form. Then, I added a floating nav, but once this worked the slides stopped functioning. I have a hunch where the problem might be, maybe an issue of different jquery versions (I took the .js files from the wesbites offering this code), but as I am a beginner with jquery I would welcome some suggestions or help with this problem. I've attempted finding a solution by googling it, but found it hard to find a relevant site with information (maybe the noConflict() method, but again, this is as yet too advanced for me). The web page which demonstrates the conflict between the scripts is w ww.agnieszka mlicka.c om/dis play.html. All images (except of the banner) are slides that do not work, but the nav on the right floats nicely as it should. If it is better to attach the code, please let me know. Thanks in advance! Agi ps. apologies for any ugly code, I am in the process of transferring to HTML5 and tidying it all up
-
Hello, i try to make an Ajax pagination, but I got error. Here is my code : Here is My Panel Controller : <?php if ( ! defined('BASEPATH')) exit('No direct script access allowed'); class Panel extends MY_AuthController { public function __construct() { parent::__construct(); $this->load->model("paneldata"); } public function index() { $this->load->view('template/header/panel.php'); $this->load->view('containt/panel.php'); $this->load->view('template/footer/panel.php'); } public function general_post($awal = 0) { $this->load->library('pagination'); $this->load->model('paneldata'); $config['base_url'] = base_url() . '/panel/general_post'; $config['total_rows'] = $this->paneldata->jumlahpost(); $config['per_page'] = 3; $this->pagination->initialize($config); $data['link'] = $this->pagination->create_links(); $data['row'] = $this->paneldata->postview($awal); //Transkrip Script $this->load->view("section/post.php",$data); } //SOME CODE BELOW HERE } Here is my Panel View for header (template/header/panel.php): <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Untitled Document</title> <?php echo link_tag('public/css/kickstart.css'); ?> <?php echo link_tag('public/css/kickstart.css'); ?> <?php echo link_tag('public/css/mine/panelstyle.css'); ?> <?php echo link_tag('public/css/mine/footer_acl.css'); ?> <?php echo '<script src="' . base_url() . 'public/js/jquery.min.js"></script>'?> <?php echo '<script src="' . base_url() . 'public/js/kickstart.js"></script>'?> <?php echo '<script src="' . base_url() . 'public/js/administration.js"></script>'?> </head> <body> And here is for content (containt/panel.php): <body> <div id="wrapper2"> <header id="logo" class="col_4"> <?php echo '<img src="' . base_url() . 'public/css/img/Logo2.png">'?> </header> <div id="tabcont" class="col_12"> <ul class="tabs left"> <li><a href="#tabr1">General</a></li> <li><a href="#tabr2">User</a></li> <li><a href="#tabr3">Gallery</a></li> <li><a href="#tabr4">Construction</a></li> </ul> <div id="tabr1" class="tab-content"> <div id="menu" class="col_3"> <ul class="menu vertical"> <li id="post"><a href="#">Post</a></li> <li id="events"><a href="#">Events</a></li> <li id="pages"><a href="#">Pages</a></li> <li id="user"><a href="#">User</a></li> <li><a href="#">Post</a></li> </ul> </div> <div id="content" class="col_9"> </div> </div> <div id="tabr2" class="tab-content">Tab2</div> <div id="tabr3" class="tab-content">Tab3</div> <div id="tabr4" class="tab-content"> <div id="menu" class="col_3"> <ul class="menu vertical"> <li id="post"><a href="#">Post</a></li> <li id="events"><a href="#">Events</a></li> <li id="pages"><a href="#">Pages</a></li> <li id="user"><a href="#">User</a></li> <li><a href="#">Post</a></li> </ul> </div> <div id="content" class="col_9"> </div> </div> </div> </div> Here is my javascript code for administration.js: $(document).ready(function() { /*UNTUK TABEL GENERAL*/ $('#tabr1 #content').load('panel/general_post'); $('#tabr4 #content').load('panel/construction_post'); $("#tabr1 #events").click(function(event){ $('#tabr1 #content').load('panel/general_event'); }); $("#tabr1 #post").click(function(event){ $('#tabr1 #content').load('panel/general_post'); }); $("#tabr1 #user").click(function(event){ $('#tabr1 #content').load('panel/general_user'); }); /*UNTUK TABEL CONSTRUCTION*/ $("#tabr4 #post").click(function(event){ $('#tabr4 #content').load('panel/construction_user'); }); /*UNTUK PAGINATION*/ $("#pagination a").click(function(event){ event.preventDefault(); /* get some values from elements on the page: */ //var $page = $( this ), // url = $page.attr( 'href' ); /* Send the data using post */ // var posting = load( url ); /* Alerts the results */ //posting.done(function( data ) { // alert("succes"); //$('#tabr1 #content').html(data); //}); alert('succes'); $('#isi').load('panel/general_user'); }); }); As you see, I use ajax to change the content of containt/panel.php. for example, if click at div#tabr1 #post, it will prevendefault and go to panel/general_post. After that, the content will change to section/post.php (because at function general_post on panel controller, it will load view section/post.php). Here is section/post.php : <!----><script type="text/javascript" src="http://localhost/2014/14_10_16_peduli_palu_ajax/public/js/jquery.min.js"></script> <script type="text/javascript" src="http://localhost/2014/14_10_16_peduli_palu_ajax/public/js/administration.js"></script> <!----> <a class="search" href="#">+ Advanced Search</a> <div style="clear:both"> </div> <a class="search" href="#"><i class="icon-refresh"></i> Refresh</a> <div style="clear:both"> </div> <div id="isi"> <table class="striped"> <tr> <td>Id</td> <td>Author</td> <td>Category</td> <td>Title</td> <td>Content</td> <td>Date Created</td> <td>Date Modified</td> <td>Action</td> </tr> <?php foreach($row as $r):;?> <tr> <td><?php echo $r->id; ?></td> <td><?php echo $r->author1; ?> <?php echo $r->author2; ?></td> <td><?php echo $r->category; ?></td> <td><?php echo $r->title; ?></td> <td><?php echo implode(' ', array_slice(explode(' ', $r->content), 0, 10)) . "..."; ?></td> <td><?php echo $r->date_created; ?></td> <td><?php echo $r->date_modified; ?></td> <td><a href="#"><i class="icon-edit"></i></a> <a href="facebook.com"><i class="icon-remove"></i></a></td> </tr> <?php endforeach; ?> </table> </div> <div id="pagination"> <?php echo $link; ?> </div> As you see in first and second line, I input the script. Why do i do this ? Because, section/post.php will not load any script in page, because section/post.php is just called by ajax (Look at admistration.js). But, if I do this, I got errors (I can't click <a> elements, I can't scroll the page, etc). And if i do not input the script (in first and second line on section/post.php), I can click the <a> elements, but the script is not worked (because section/post.php does not identify the script) What should I do ? I Hope you understand my question..