I have been learning programming online for like 3 years. I have developed big project in this time, but I have a problem. I didn't know about MVC pattern and was how to say "Programming from scratch". Right now my code is a big mess, that no one can understand, but only me..
I found out about this MVC pattern and it's a excellent thing but right now I can't understand where and how to make couple of things. How I understand that no php code goes to view? And no html/css into model.
For example in which structure I have to implement my javascript and ajax code? (Is it view?)
Where and how to manage displaying if's? Like:
if($user_id == $me){
//display post with delete option
}else{
//display post
}
I have a functions with houndreds of lines and if's. For example one of my functions. I want to understand how to reproduce it in MVC pattern.
public function selectUserPosts(){
try{
require_once('Class.Users.php');
$user = new USER();
$id = $_GET['id'];
$stmt = $this->conn->prepare("SELECT * FROM fun_posts WHERE addedby=('$id') ORDER BY date DESC");
$stmt->execute();
$result = $stmt->fetchAll();
foreach($result as $post){
?>
<div class="col-sm-4">
<div class="animated flipInY" id="panel_<?php echo $post['id'];?>">
<div class="thumbnail" style="height:300px;">
<a href="/Web/Pages/Fun/Fun_Post.php?action=select&image_id=<?php echo $post['id'];?>" target="_blank">
<img class="img" style="width: 100%; height:150px;" src="<?php echo $post['image']; ?>" alt="" />
</a>
<i class="fa fa-clock-o" aria-hidden="true"></i><?php echo $user->time_elapsed($post['date']); ?>
<div id="upvote_<?php echo $post['id'];?>" class="panel">
<i class="fa fa-arrow-circle-up" style="font-size:22px; margin-top:10px;"></i> <b id="upvote_panel_<?php echo $post['id'];?>"><?php echo $post['upvotes']; ?></b>
<button style="float:right; margin-top:5px; width:90px;" class="btn btn-sm btn-success" type="submit"><i class="fa fa-arrow-circle-up"></i> Upvote</button>
</div>
<div id="downvote_<?php echo $post['id'];?>" class="panel">
<i class="fa fa-arrow-circle-down" style="font-size:22px; margin-top:-5px;"></i> <b id="downvote_panel_<?php echo $post['id'];?>"><?php echo $post['downvotes']; ?></b>
<button style="float:right; margin-top:-10px; width:90px;" class="btn btn-sm btn-danger" type="submit"><i class="fa fa-arrow-circle-down"></i> Downvote</button>
</div>
<div id="comment_<?php echo $post['id'];?>" class="panel">
<i class="fa fa-comment" style="font-size:22px; margin-top:-10px;"></i> <b id="comment_panel_<?php echo $post['id'];?>"><?php echo $post['comments']; ?></b>
<a href="/Web/Pages/Fun/Fun_Post.php?action=select&image_id=<?php echo $post['id'];?>" target="_blank">
<button style="float:right; margin-top:-13px; width:90px;" class="btn btn-sm btn-primary" type="submit"><i class="fa fa-comment"></i> Comment</button>
</a>
</div>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(function(){
$("#upvote_<?php echo $post['id'];?>").click(function(){
$.ajax(
{ url: "Home.php?upvote-btn=true?action=select&image_id=<?php echo $post['id'];?>",
type: "get",
success: function(result){
$('#upvote_panel_<?php echo $post['id'];?>').load(document.URL + ' #upvote_panel_<?php echo $post['id'];?>');
$('#downvote_panel_<?php echo $post['id'];?>').load(document.URL + ' #downvote_panel_<?php echo $post['id'];?>');
$('#comment_panel_<?php echo $post['id'];?>').load(document.URL + ' #comment_panel_<?php echo $post['id'];?>');
document.getElementById('result-box').innerHTML += result;
}
});
});
$("#downvote_<?php echo $post['id'];?>").click(function(){
$.ajax(
{ url: "Home.php?downvote-btn=true?action=select&image_id=<?php echo $post['id'];?>",
type: "get",
success: function(result){
$('#upvote_panel_<?php echo $post['id'];?>').load(document.URL + ' #upvote_panel_<?php echo $post['id'];?>');
$('#downvote_panel_<?php echo $post['id'];?>').load(document.URL + ' #downvote_panel_<?php echo $post['id'];?>');
$('#comment_panel_<?php echo $post['id'];?>').load(document.URL + ' #comment_panel_<?php echo $post['id'];?>');
document.getElementById('result-box').innerHTML += result;
}
});
});
});
</script>
<?php
}
}
catch(PDOException $e)
{
echo $e->getMessage();
}
}
MVC - Model View Controller
1) In the Model you have to place all logic and work with databases and other services
2) In the View you have to place code, that will see user (you can't call logic methods or functions those use services like database in there)
3) And Controller have to connect Model and View together. And, of course, it have to be as route manager
Related
I am working on a page where I can search for a name or surname and filter actively (this part works perfectly). Once I have found the relevant record I then need to be able to complete an action using one of four buttons related to the record. All of this needs to work without the page refreshing (I am therefore using ajax). if I do not search and click one of the four buttons it works perfectly and I get an alert at the top of the page without any refresh BUT when I do a search and try the page refreshes and therefore I do not get the alert at the top of the page and my search is cleared. I have made other submissions before and noone has helped me at all so I am really hoping that this time someone will be able to assist.
I have tried the solutions listed below:
Type=Button: for each of the buttons - the button does not work at all in the search option
With the above one I have tried including a submit action in the javascript - it still does not work
e.stopPropagation(): page still refreshes
using $_SESSION['msg']: doesn't show the alert for the non-search option and refreshes the page for the search option so my search is still cleared
My code is as follows:
The search page
<?php
include("includes/header.php");
if (isset($_GET['event_id'])) {
$event_id = $_GET['event_id'];
$event = new Event($con, $userLoggedIn);
$eventname = $event->getEventName($event_id);
$table = $event->getTableName($event_id);
$guest = new Guest($con, $userLoggedIn);
// echo "<script>console.log(" . $eventname . ")</script>";
}
$stmt = $con->prepare("SELECT * FROM " . $table);
$stmt->execute();
$result = $stmt->get_result();
?>
<div class="flex-container">
<div class="stats_details column">
**... code not related to the question**
</div>
<div class="main_column column">
<?php
if (isset($_SESSION['msg'])) {
echo $_SESSION['msg'];
unset($_SESSION['msg']);
} ?>
<div id="message"></div>
<hr>
<div class="form-inline">
<label for="search" class="font-weight-bold lead text-dark">Search Record </label>
<input type="text" name="search" id="search_text" class="form-control form-control-lg rounded-0 border-primary" placeholder="Search...">
</div>
<hr>
<div class="cards-list" id="table-data">
<?php while ($row = $result->fetch_assoc()) { ?>
<div class="card m-2">
<div class="card-header <?= $row['checkin_guests'] > 0 ? 'success' : 'deep_blue'; ?> text-muted">
Guests: <?= $row['total_guests']; ?> | Checkedin: <?= $row['checkin_guests']; ?>
</div>
<div class="card-body">
<div class="card-title h3"><i class="fas fa-user"></i> <?= $row['first_name']; ?> <?= $row['last_name']; ?></div>
<p class="card-text"><i class="fa fa-building" aria-hidden="true"></i> <?= $row['company']; ?></p>
<p class="card-text"><i class="fa fa-at" aria-hidden="true"></i> <?= $row['email']; ?></p>
<p class="card-text"><i class="fa fa-phone" aria-hidden="true"></i> <?= $row['phone']; ?></p>
</div>
<div class="card-footer default text-muted">
<form action="" method="POST" class="action_buttons">
<input type="hidden" class="gid" value="<?= $row['id']; ?>">
<button class="btn success checkin" data-toggle="tooltip" data-placement="top" title="Checkin"><i class="fas fa-user-check" aria-hidden="true"></i></button>
<button class="btn warning" data-toggle="tooltip" data-placement="top" title="Checkout" name="Checkout"><i class="fas fa-user-times" aria-hidden="true"></i></button>
<button class="btn info" data-toggle="tooltip" data-placement="top" title="Edit" name="Edit"><i class="fas fa-user-edit" aria-hidden="true"></i></button>
<button class="btn danger" data-toggle="tooltip" data-placement="top" title="Cancel" name="Cancel"><i class="fas fa-user-slash" aria-hidden="true"></i></button>
</form>
</div>
</div>
<?php
}
?>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
var event = <?php echo $event_id; ?>;
//live search
$("#search_text").keyup(function() {
var search = $(this).val();
$.ajax({
url: 'action.php',
method: 'POST',
data: {
query: search,
event: event
},
success: function(response) {
$("#table-data").html(response);
}
});
});
//checkin
$(".checkin").click(function(e) {
e.preventDefault();
$("#message").html('');
var $form = $(this).closest(".action_buttons");
var gid = $form.find(".gid").val();
$.ajax({
url: 'action.php',
method: 'POST',
data: {
gid: gid,
checkin: 'checkin',
event: event
},
success: function(response) {
$("#message").html(response);
window.scrollTo(0, 0);
}
});
});
});
</script>
</body>
</html>
action.php
<?php
require 'config/config.php';
include("includes/classes/User.php");
include("includes/classes/Event.php");
include("includes/classes/Guest.php");
$userLoggedIn = $_SESSION['username'];
$event = new Event($con, $userLoggedIn);
$guest = new Guest($con, $userLoggedIn);
if (isset($_POST['query'])) {
$output = '';
$search = $_POST['query'];
$event_id = $_POST['event'];
$table = $event->getTableName($event_id);
$_SESSION['search'] = $search;
$stmt = mysqli_query($con, "SELECT * FROM `$table` WHERE first_name LIKE '%$search%' OR last_name LIKE '%$search%'");
if (mysqli_num_rows($stmt) > 0) {
while ($row = mysqli_fetch_assoc($stmt)) {
$checked_class = $row['checkin_guests'] > 0 ? "success" : "deep_blue";
$output .= '
<div class="card m-2">
<div class="card-header ' . $checked_class . ' text-muted">
Guests:' . $row['total_guests'] . ' | Checkedin: ' . $row['checkin_guests'] . '
</div>
<div class="card-body">
<div class="card-title h3"><i class="fas fa-user"></i> ' . $row['first_name'] . ' ' . $row['last_name'] . '</div>
<p class="card-text"><i class="fa fa-building" aria-hidden="true"></i> ' . $row['company'] . '</p>
<p class="card-text"><i class="fa fa-at" aria-hidden="true"></i> ' . $row['email'] . '</p>
<p class="card-text"><i class="fa fa-phone" aria-hidden="true"></i> ' . $row['phone'] . '</p>
</div>
<div class="card-footer default text-muted">
<form action="" method="POST" class="action_buttons">
<input type="hidden" class="gid" value="' . $row['id'] . '">
<button class="btn success checkin" data-toggle="tooltip" data-placement="top" title="Checkin"><i class="fas fa-user-check" aria-hidden="true"></i></button>
<button class="btn warning" data-toggle="tooltip" data-placement="top" title="Checkout"><i class="fas fa-user-times" aria-hidden="true"></i></button>
<button class="btn info" data-toggle="tooltip" data-placement="top" title="Edit"><i class="fas fa-user-edit" aria-hidden="true"></i></button>
<button class="btn danger" data-toggle="tooltip" data-placement="top" title="Cancel"><i class="fas fa-user-slash" aria-hidden="true"></i></button>
</form>
</div>
</div>
';
}
echo $output;
} else {
echo "<h3>No Records Found</h3>";
}
}
if (isset($_POST['checkin'])) {
$event_id = $_POST['event'];
$table = $event->getTableName($event_id);
$gid = $_POST['gid'];
$result = $guest->checkin($event_id, $gid);
/* $_SESSION['msg'] = '<div class="alert alert-success alert-dismissible mt-2">
<button type="button" class="close" data-dismiss="alert">×</button>
<strong>Guest ' . $gid . ' Checked In Successfully in ' . $table . ' response: ' . $count . '</strong>
</div>'; */
echo $result;
}
?>
The guest checkin class
public function checkin($event_id, $id) {
$table= $this->event_obj->getTableName($event_id);
$guest_list_query = mysqli_query($this->con, "SELECT checked, checkin_guests FROM " . $table ." WHERE `id`='$id'");
//echo "<script>console.log(" . $table . ")</script>";
$count = mysqli_num_rows($guest_list_query);
//echo "<script>console.log(" . $count . ")</script>";
/* $_SESSION['msg'] = '<div class="alert alert-success alert-dismissible mt-2">
<button type="button" class="close" data-dismiss="alert">×</button>
<strong>Guest ' . $id . ' Checked In Successfully in ' . $table . ' response: ' . $count . '</strong>
</div>'; */
echo '<div class="alert alert-success alert-dismissible mt-2">
<button type="button" class="close" data-dismiss="alert">×</button>
<strong>Guest ' . $id . ' Checked In Successfully in - response rows: ' . $count . '</strong>
</div>';
}
what i get from your explanation is, $(".checkin").click not work after you do a search, its because javascript only work once, when all page finish loaded.
when you do search, a new button will appear and javascript not called again to give button check in onclick, thats why your button on click not working.
so i suggest you to using solution no. 1 Type=Button: for each of the buttons
copy your javascript $(".checkin").click, document ready and other function/include that need to copy to make checkin click work to action.php
example: copy this to action.php
<script type="text/javascript">
$(document).ready(function() {
var event = <?php echo $event_id; ?>;
//checkin
$(".checkin").click(function(e) {
e.preventDefault();
$("#message").html('');
var $form = $(this).closest(".action_buttons");
var gid = $form.find(".gid").val();
$.ajax({
url: 'action.php',
method: 'POST',
data: {
gid: gid,
checkin: 'checkin',
event: event
},
success: function(response) {
$("#message").html(response);
window.scrollTo(0, 0);
}
});
});
});
</script>
or
still using solution no 1 type button, then make your javascript onclick as function outside document ready then make button onClick (action.php and search page) to call that function
} -> end document ready
function checkinButton(){
var $form = $(this).closest(".action_buttons");
var gid = $form.find(".gid").val();
$.ajax({
url: 'action.php',
method: 'POST',
data: {
gid: gid,
checkin: 'checkin',
event: event
},
success: function(response) {
$("#message").html(response);
window.scrollTo(0, 0);
}
});
}
Button:
<button onClick="checkinButton()" class="btn success checkin" data-toggle="tooltip" data-placement="top" title="Checkin"><i class="fas fa-user-check" aria-hidden="true"></i></button>
I'm using a slick slider. While I'm calling a HTML part which have slick slider using AJAX call it is not working. I've mentioned my code as below:
$(document).ready(function(){
var year = $("#year").val();
if(year == 'all'){
$.ajax({
method: 'post',
url: 'helpData.php',
data: {year:year},
success: function(data){
$("#helpData").html(data);
}
});
}
});
This is an AJAX call.
if ($(this).is(".slider3")){
$(this).slick({
dots: true,
autoplay:true,
autoplaySpeed:1500,
prevArrow: false,
nextArrow: false,
});
}
This code is for slick slider which is in another JS file which I already included.
<?php
foreach ($helpData as $hdata) {
$heData = $help->getAllImg($hdata->heid);
?>
<div class="col-md-6">
<div class="onePost">
<div class="mySlider slider3">
<?php foreach( $heData as $himg ){ ?>
<div class="bannerSlider">
<img src="<?php echo SITE_URL; ?>/img/help/<?php echo $himg->photo; ?>" class="img-responsive otherImages" />
</div>
<?php } ?>
</div>
<a href="highlightpost.php?id=<?php echo $hdata->heid; ?>">
<p class="photoCaption">
<?php echo $hdata->title; ?>
</p>
</a>
<p style="float: right;">
<i class="fas fa-share-alt"></i>
</p>
</div>
</div>
<?php } ?>
<?php } ?>
This is my helpData.php code which is called using AJAX.
Try this,
<?php
$html='';
foreach ($helpData as $hdata) {
$heData = $help->getAllImg($hdata->heid);
$html .= '<div class="col-md-6">
<div class="onePost">
<div class="mySlider slider3">';
foreach ($heData as $himg) {
$html .='<div class="bannerSlider">
<img src="'.SITE_URL.'/img/help/'.$himg->photo.'" class="img-responsive otherImages" />
</div>';
}
$html .='</div>
<a href="highlightpost.php?id='.$hdata->heid.'">
<p class="photoCaption">'.$hdata->title.'</p>
</a>
<p style="float: right;">
<i class="fas fa-share-alt"></i>
</p>
</div>
</div>';
}
echo $html;
?>
I m have 2 my code and one work and when i use code 2 not work.
Javascript is still the same.
This is javascript and work
function addto(selid)
{
var i;
var item = "";
for (i = 0; i < 1000; i++) {
item = "incart_"+i;
if(getCookie(item) == "")
{
setCookie(item,selid,24);
break;
}
}
}
This code work
<button onclick='addto("1");' data-toggle="tooltip" title="Add"><i class="fa fa-shopping-cart shop-card-icon"> </i></button >
but when i use php does not respond
// If i use the action in php it goes.
<button <?php echo "onclick='addto('".$row["id"]. "');'"; ?> data-toggle="tooltip" title="Add"><i class="fa fa-shopping-cart shop-card-icon"> </i></button>
Use PHP only on the dynamic part:
<button onclick="addto('<?= $row['id'] ?>')" data-toggle="tooltip" title="Add"><i class="fa fa-shopping-cart shop-card-icon"></i></button>
You have an escaping issue, you can either echo the whole button and use proper escaping on the quotes, or just echo the dynamic part
Echo just the dynamic part (best option)
<button onclick="addto('<?php echo $row["id"]; ?>')" data-toggle="tooltip" title="Add"><i class="fa fa-shopping-cart shop-card-icon"> </i></button>
Echo the whole button
<?php echo '<button onclick="addto(\''. $row["id"] .'\')" data-toggle="tooltip" title="Add"><i class="fa fa-shopping-cart shop-card-icon"> </i></button>'; ?>
Here is the Mailchimp shortcode used in the Wordpress:
Here is the code →
<div class="email-button-one-line">
<input type="text" name="email" id="email-<?php echo $random?>" value="" class="field-email-oneline" placeholder="<?php _e('Your Email Address', 'charito');?>"/><input type="submit" class="button field-email-button" name="mailchimp_submit" id="mailchimp_submit-<?php echo $random?>" value="<?php _e("Subscribe", 'charito');?>" />
<div class="clearfix"></div>
</div>
<script>
jQuery.noConflict();
jQuery(document).ready(function()
{
jQuery('#mailchimp_submit-<?php echo $random?>').click(function()
{
jQuery('#process-<?php echo $random?>').css('display','block');
var datastring = '&name=' + escape(jQuery('#name-<?php echo $random?>').val()) + '&email=' + escape(jQuery('#email-<?php echo $random?>').val()) + '&api_key=<?php echo get_theme_mod('blogeto_mailchimp_api_key');?>&list_id=<?php echo get_theme_mod('blogeto_mailchimp_list_id');?>';
jQuery.ajax({
url: '<?php echo rest_url('/mc/rest/pchimp/');?>',
data: datastring,
success: function(msg)
{
jQuery('#process-<?php echo $random?>').css('display','none');
jQuery('#newsletter_msg-<?php echo $random?>').html(msg);
},
error: function(msg)
{
jQuery('#process-<?php echo $random?>').css('display','none');
jQuery('#newsletter_msg-<?php echo $random?>').html(msg);
}
});
return false;
});
});
</script>
Issue→
This code portion is an issue to be discussed:
<input type="submit" class="button field-email-button" name="mailchimp_submit" id="mailchimp_submit-<?php echo $random?>" value="<?php _e("Subscribe", 'charito');?>" />
I wish to change this to button, but as soon as I do this →
<button type="submit" class="button field-email-button" name="mailchimp_submit" id="mailchimp_submit-<?php echo $random?>" value="<?php _e("Subscribe", 'charito');?>" /> <i class="fa fa-envelope" aria-hidden="true"> </i> Subscribe </button>
It stops working.
You might argue why button?
Reason →
there are various other options such as Aweber, Feedburner etc; in
total 7 and the CSS IS wrote in such a way to use the button
secondly, I have to also use this : <i class="fa fa-envelope" aria-hidden="true"> </i> Subscribe which is not possible in <input>
when I change the input to button why it doesn't work, and what is the fix?
hi guys i am trying to get a button id that is in a for loop so whenever the button click the unique id that can be differentiated from other ids should be able to work. let me show you my code.
<?php foreach ($message as $key ) : ?>
<?php echo $senders_user_id=$key['senders_id']; ?>
<div class="senders_id" S_id="<?php echo $key['senders_id']; ?>" style="display: none;"></div>
<a class="list-group-item">
<div class="checkbox">
<label>
<?php echo form_open(,['id'=>'sender_user_id']); ?>
<input type="checkbox">
<button id="senders_id" class="Read" S_id="<?php echo $key['senders_id'];?>" onclick="readbyuser($senders_user_id);">Read</button>
<button id="senders_id" class="unread" S_id="<?php echo $key['senders_id'];?>" onclick="unreadbyuser($senders_user_id);">Unread</button>
</label>
</div>
<span class="glyphicon glyphicon-star-empty"></span><span class="name" style="min-width: 120px;
display: inline-block;"><?php echo $key['uname']; ?></span> <span class=""><?php echo $key['textdata']; ?></span>
<span class="text-muted" style="font-size: 11px;"></span> <span class="badge">12:10 AM</span> <span class="pull-right"><span class="glyphicon glyphicon-paperclip">
<?php echo form_close(); ?>
</span></span></a>
<?php endforeach; ?>
</div>
Now here there are three post meaning three 'senders_id' so when i click on button Read the id of that should pass but the same id is passing again and again no matter which button i click on
Here is my code
function readbyuser()
{
var senders_id=$('#senders_id').attr('S_id');
var Recievers_id=$('.Recievers_id').attr('R_id');
jQuery.ajax({
type:'post',
url:'<?php echo base_url("user/read_by_user"); ?>',
data:{id:senders_id,R_id:Recievers_id},
dataType:'json',
success:function(data)
{
console.log(data);
alert(data);
$('.unread').removeClass('unread_user');
$('.Read').addClass('read_user');
}
});
}
function unreadbyuser()
{
var senders_id=$('#senders_id').attr('S_id');
var Recievers_id=$('.Recievers_id').attr('R_id');
jQuery.ajax({
type:'post',
url:'<?php echo base_url("user/unread_by_user"); ?>',
data:{id:senders_id,R_id:Recievers_id},
dataType:'json',
success:function(data)
{
$('.Read').removeClass('read_user');
$('.unread').addClass('unread_user');
}
});
}
please tell me what i am doing wrong
<button id="senders_id" class="Read" S_id="<?php echo $key['senders_id'];?>" onclick="readbyuser($senders_user_id);">Read</button>
<button id="senders_id" class="unread" S_id="<?php echo $key['senders_id'];?>" onclick="unreadbyuser($senders_user_id);">Unread</button>
Two elements cannot have samei id. Use class name instead.
Also you can pass PHP values directly in this.
onclick="readbyuser($senders_user_id);"
as
onclick="readbyuser(<?php echo $key['senders_id'];?>);"