|
PHP - Bootstrap Divs Over Html5 Tags?
Hi,
I've been looking at the Bootstrap 3 and various tutorials / example sites even from their own website. This has lead me to a question I cannot seem to find a quick answer to why do they use divs over the new HTML5 tags such as nav.
For example;
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Project name</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
Comapred to something more like;
<div class="container">
<nav>
<ul>
<li><a href="#"> Home </a></li>
</ul>
</nav>
</div>
I know these two examples don't match up in the slightest but I'm not looking for the synatx just an explaniation. Is it the fact that HTML5 is still the draft stages and IE doesn't handle nav to gracefully wihtout shiv etc...
Or is the developer of the examples is just a bit lazy and couldn't be bothered to swap it to the newer tags?
The reason I ask is I'm not too sure which way would be the best for developing a site using bootstrap.
Thanks in advance.
Similar TutorialsI have the following php block that works on an existing bootstrap webpage:
<?php
$isos = glob('download/*.iso');
$iso = $isos[count($isos) -1];
$isoname = basename($iso);
$isodown = "/".$isoname;
$md5file = md5_file($iso);
$pdfs = glob('download/foxcloneV*.pdf');
$pdf = $pdfs[count($pdfs) -1];
$pdfname = basename($pdf);
$debs = glob('download/*.deb');
$deb = $debs[count($debs) - 1];
$debname = basename($deb);;
$srcs = glob('download/*.tar.*');
$src = $srcs[count($srcs) - 1];
$srcname = ltrim($src,'download/');
?>
When I try to use it in a non-bootstrap website, it fails with the following errors: Notice: Undefined offset: -1 in /home/larry/web/test2/public_html/download.php on line 104 Warning: md5_file(): Filename cannot be empty in /home/larry/web/test2/public_html/download.php on line 106 Notice: Undefined offset: -1 in /home/larry/web/test2/public_html/download.php on line 109 Notice: Undefined offset: -1 in /home/larry/web/test2/public_html/download.php on line 113 Notice: Undefined offset: -1 in /home/larry/web/test2/public_html/download.php on line 117
Each of these failures is the line after the glob. Is the glob failing or is the syntax wrong for non-bootstrap use? Either way, my thinking is that php should behave the same regardless of what the base model for the website is. Both the bootstrap and non-bootstrap sites are running locally under apache2.4 and php7.2. Can someone provide some insight? I work with PHP and I'm not good with JS.
I want to use a Twitter Boostrap tab funnction: http://getbootstrap....avascript/#tabs
I need some guidance how it uses the JS code mentioned.
The code below taken from the Bootstrap page is obvious enough:
$('#myTab a').click(function (e) {
e.preventDefault()
$(this).tab('show')
})
What I do not understand is how I am required to use the following code in the context of the previous code. Ok, I get that I have to choose one option, but I don't get how they fit together and I do not get how I can have 5-7 tabs and how they will be highlighted one after the other as per the given example on the Bootstrap page :
$('#myTab a[href="#profile"]').tab('show') // Select tab by name
$('#myTab a:first').tab('show') // Select first tab
$('#myTab a:last').tab('show') // Select last tab
$('#myTab li:eq(2) a').tab('show') // Select third tab (0-indexed)
Many thanks for all your help !
Hello all, I have a website with a form that I want a user to fill out then if it is valid I have the button submit and I want it to email me. The message. If success full I want a message to popup on screen saying success I am using bootstrap 4
<div class="messageSuccess"></div>
<div class="row">
<div class="col-md-9 mb-md-0 mb-5">
<form id="contact-form" name="contact-form" action="" method="post"> <!--action="contactEmail.php" -->
<div class="row ">
<div class="col-md-6 ">
<div class="md-form mb-0 ">
<input class="form-control" type="text" id="txtName" name="txtName" required />
<label for="txtName">Your Name </label>
<div class="nameError"></div>
</div>
</div>
<div class="col-md-6 ">
<div class="md-form mb-0 ">
<input class="form-control" type="text" id="txtEmail" name="txtEmail" required />
<label id="lblEmail" for="txtEmail">Your Email Address </label>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="md-form mb-0">
<input class="form-control" type="text" id="txtSubject" name="txtSubject" data-error="Subject Here" required />
<label for="txtSubject">Subject </label>
<div class="help-block with-errors"></div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="md-form">
<textarea class="form-control" type="text" id="txtMessage" name="txtMessage" rows="4" required data-error="Please leave us a message."></textarea>
<label for="txtMessage">Your Message </label>
</div>
</div>
</div>
<div class="text-center text-md-left">
<input type="submit" id="BtnFormSubmit" class="btn btn-primary btn-xl text-white" value="Send Message" />
</div>
<div class="status"></div>
</form>
<!-- JavaScript Inner File Form Validation -->
<script type="text/javascript">
$(document).ready(function () {
var form = $("#contact-form");
var name = $("#txtName").val();
var email = $("#txtEmail").val();
var subject = $("#txtSubject").val();
var message = $("#txtMessage").val();
var btnSubmit = $("BtnFormSubmit");
$(form).submit(function (event) {
if (this.checkValidity() == false) {
$(this).addClass("was-validated");
event.preventDefault();
event.stopPropagation();
}
alert("Form Valid to create message");
if (!event.isDefaultPrevented) {
alert("passed prevent default");
var url = "testemail.php";
// POST values 'ajax'
$.ajax({
type: "POST",
url: url,
data: $(this).serialize(),
success: function (data) { // done:
// data = JSON object object for contactEmail.php
// recieve message type: success | danger
var messageAlert = "alert- " + data.type;
var messageText = data.message;
// Bootstrap alert box HTML
var alertBox = '<div class="alert ' + messageAlert + ' alert-dismissable"><button type="button" class="close" ' +
'data-dismiss="alert" aria-hidden="true">×</button>' + messageText + '</div>';
// if messageAlert and messageText
if (messageAlert && messageText) {
// Put message on page in messageSuccess section.
$(form).find("#messageSuccess").html(alertBox);
// Reset the form.
$(form)[0].reset();
}
}
});
//return false;
}
});
//$(name).blur(function () {
//})
// Validate :inputs
$(":input").blur(function () {
let controlType = this.type;
switch (controlType) {
case "text":
case "password":
case "textarea":
validateText($(this));
break;
case "email":
validateEmail($(this));
break;
default:
break;
}
});
// each :input focusin remove existing validation messages if any.
$(":input").click(function () {
$(this).removeClass("is-valid is-invalid");
})
/* OPTIONAL ':input' KEYDOWN validation messages remove */
// Reset Form and remove all validation messages.
$(":reset").click(function () {
$(":input").removeClass("is-valid is-invalid");
$(form).removeClass("was-validated");
});
});
// Validate Text Function
function validateText(control) {
let textField = control.val();
if (textField.length > 1) {
$(control).addClass("is-valid");
} else {
$(control).addClass("is-invalid");
}
}
// Validate Email Function (Email newer regex: /^([\w-\.]+@([\w-]+\.)+[\w-]{2,6})?$/ )
function validateEmail(control) {
let textField = control.val();
let regexPattern = /^\b[A-Z0-9._%-]+@[A-Z0-9.-]+\.[A-Z]{2,6}\b$/i;
if (regexPattern.test(textField)) {
$(control).addClass("is-valid");
} else {
$(control).addClass("is-invalid");
}
}
</script>
<?php
$from = 'SampleEmail@YourEmail.com';
$sendTo = 'sample@Gmail.com';
$subject = 'Your Message Subject Here';// Email Message Contact Form Fields
// Array - ($varName => Text from controls)
$controls = array('txtName' => 'Name', 'txtEmail' => 'Email', 'txtSubjext' => 'Subject', 'txtMessage' => 'Message');
$successMessage = 'Contact Message Successfully Sent. Thank you, I will get back to you soon.';
$errorMessage = 'There was an error submitting your message, Please try again. Or try later.';
error_reporting(E_ALL & ~E_NOTICE);
try {
if(count($_POST) == 0) throw new \Exception('Contact Form Message is empty');
$emailText = "You have a new message from your contact form\n------------------------------------------------------\n";
foreach($_POST as $key => $value) {
if(isset($controls[$key])) {
$emailText .= "$controls[$key]: $value\n";
}
}
$headers = array('Content-Type: text/plain; charset="UTF-8";',
'From: ' . $from,
'Reply-To: ' . $from,
'Return-Path: ' . $from,
);
// Send email
mail($sendTo, $subject, $emailText, implode("\n", $headers));
$responseArray = array('type' => 'success', 'message' => $successMessage);
}
catch(\Exception $e) {
$responseArray = array('type' => 'danger', 'message' => $errorMessage);
}
// If AJAX request return JSON response **RARE**
if(!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
$encodedJSON = json_encode($responseArray);
header('Content-Type: application/json');
echo $encodedJSON;
}
else {
echo $responseArray['message'];
}
?>
In Bootstrap I have the following piece of code that validate all the fields in the form:
/**
* Called when all validations are completed
*/
_submit: function() {
var isValid = this.isValid(),
eventType = isValid ? this.options.events.formSuccess : this.options.events.formError,
e = $.Event(eventType);
this.$form.trigger(e);
// Call default handler
// Check if whether the submit button is clicked
if (this.$submitButton) {
isValid ? this._onSuccess(e) : this._onError(e) ;
}
},
What I want is if it's success (this._onSuccess(e)) to submit the form with the following code json:
$("document").ready(function(){
$(".js-ajax-php-json").submit(function(){
var data = {
"action": "test"
};
data = $(this).serialize() + "&" + $.param(data);
$.ajax({
type: "POST",
dataType: "json",
url: "https://www.telekom.ro/delivery/formAction/fix-mobil/response.php", //Relative or absolute path to response.php file
data: data,
success: function(data) {
$(".the-return").html(
//"Favorite beverage: " + data["favorite_beverage"] + "<br />Favorite restaurant: " + data["favorite_restaurant"] + "<br />Gender: " + data["gender"] + "<br />JSON: " + data["json"]
data["ok"]
);
$(".error").html(
data["error"]
);
//alert("Form submitted successfully.\nReturned json: " + data["json"]);
},
});
return false;
});
});
I tried to replace the "e" from (this._onSuccess(e)) with the code from above but not success. Both code works good individual.
Practicaly I need to submit the form, then all the fields are validated, with that json code.
Can anyone help me please?
I have a blog on my website and the blogs content is stored in a database. On my home page I have the two recent articles displayed on my home page but I have to change them manually so I add the recent article on the home page in the first column and the second most recent one in the next column so they are side by side. What I want to do is automatically display the blogs image and blog title from the database and display on the home page so I don't have to keep changing it manually My current code looks like the following
<div class="block">
<div class="container">
<h3 class="text-center"><span class="color">Recent Blog Articles</span></h3>
<div class="row">
<div class="col-md-6">
<div class="text-img animation" data-animation="fadeInLeft" data-animation-delay="0.5s">
<a href="https://www.it-doneright.co.uk/blog/one-year-to-go-until-end-of-support-for-windows-7">
<div class="image">
<img class="img-responsive" src="https://www.it-doneright.co.uk/images/blog/windows7-eos-new.jpg" alt="One year to go until end of support for Windows 7">
</div>
<p>One year to go until end of support for Windows 7</p>
</a>
</div>
</div>
<div class="col-md-6">
<div class="text-img animation" data-animation="fadeInLeft" data-animation-delay="0.5s">
<a href="https://www.it-doneright.co.uk/blog/windows-10-is-going-to-require-7gb-of-storage-for-future-updates">
<div class="image">
<img class="img-responsive" src="https://www.it-doneright.co.uk/images/windows-ten-updates-needing-7gb-space-on-hard-drive.jpg" alt="Windows 10 is going to require 7gb of storage for future updates">
</div>
<p>Windows 10 is going to require 7gb of storage for future updates</p>
</a>
</div>
</div>
</div>
</div>
</div>
I did look on Google before posting but could not get my head around how to do it, could anyone point me in the right direction or start me off and will have a go I'm a major JS noob and this is driving me nuts. I'm trying to use this in a form:
http://reactiveraven...trapValidation/
And using the examples, can't get anything to work. Only my browser's non-js HTML 5 form validation. Anybody have a simple that incorporates both HTML and JS? The examples only show the html.
I have php file which return data in json format
<?php
include_once('con.php');
$mydata = array();
$data = $con -> prepare('SELECT * FROM user');
$data -> execute();
while($result = $data->fetch()) {
$mydata[] = $result['id'];
$mydata[] = $result['first_name'];
$mydata[] = $result['last_name'];
}
echo json_encode($mydata);
?>
the problem is the footable require both columns and rows how to get colums?
$(document).ready( function() {
var ft = FooTable.init('#user', {
columns: $.get("how to get the table column"),
rows: $.get("row.php")
});
});
There is no documentation about how to do that with php look here https://fooplugins.github.io/FooTable/docs/examples/advanced/ajax.html
I built a Bootstrap site but when I view it on my phone (Samsung Galaxy S3), it doesn't collapse the navigation menu into the mobile button like I thought it would. I did some research and realized that my phone is actually the same resolution as my desktop (1920x1080) so it's giving me the desktop view. Bootstrap, to my surprise, only seems to be responsive to resolutions, not physical screen sizes. How do I overcome this? I want to build a site which is responsive to physical screen size, regardless of resolution.
Edited by DeX, 11 June 2014 - 04:01 PM. I have a boostrap conflict regarding box sizing. I solved it with a simple CSS rule:
* {
box-sizing: content-box;
}
Now the problem is my bootstrap form isn't working. I need to make the box sizing apply to everything except the bootstrap form:
<form id="contactForm" action="<?php echo htmlspecialchars($_SERVER['PHP_SELF'],ENT_QUOTES); ?>" method='post'> <!-- HTML HERE --> </form>Any ideas? Thanks. Hi,I used bootstrap to create a webpage and one of the special effects is when you scroll down the page the section you are at is highlighted in the menu. This seems to work ok for all of my sections except the About Me section in which case the next section down (resume) is highlighted instead.
Here is the specific area on the page (http://www.inspired-...p#section-about).
I was wondering if anyone familiar with Boostrap and the Amoeba theme had any suggestions on a fix for this.
thanks in advance.
I'm using the following script: http://jsfiddle.net/VzVy6/8/ It give a alert message that slide in/out when a required field is still empty on submit. The script works fine, and in this example its only one field. When the field is empty I see the fade in alert message, and when the field has been filled in I see a normal popup alert message: alert("Would be submitting form"); I can't get it to work to change this alert message to a page POST submit. I was looking online, and I see Ajax examples that I don't get to work. What I want is that when all fields are filled in, that the form POST submit to another page including the values in the textboxes ofcourse. Maybe its something really easy, but I have already a headache because tried to get it to work for more then 5 hours in a row. Thank you for your time. I've been working on developing a CMS blog and now I'm trying to create a slideshow wit Bootstrap Carousel on the homepage to present the dynamic content (images + text) using the data from table 'posts'. I tested this code, and it only presents one post. I mean, It's not possible to go to the next slide. I want to show all the posts on the slides. *The DB connection is already on the includes. The connection was written on a small file called DB.php Home.php
<header>
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner" role="listbox">
<?php
// The default SQL query
$sql = "SELECT * FROM posts ORDER BY id desc";
$stmt = $ConnectingDB->query($sql);
while ($DataRows = $stmt->fetch()) {
$Id = $DataRows["id"];
$PostTitle = $DataRows["title"];
$Image = $DataRows["image"];
$PostText = $DataRows["post"];
?>
<!-- Slide -->
<div class="carousel-item active" style="background-image: url('uploads/<?php echo $Image; ?>')">
<div class="carousel-caption">
<div class="card-body black">
<h3 class="large-mistral-white"><?php echo $PostTitle; ?></h3>
<p class="small-times-white"><?php echo $PostText; ?></p>
</div>
</div>
</div>
<?php } ?>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</header>
DB.php <?php $DSN='mysql:host = localhost; dbname=everybody_blog'; $ConnectingDB = new PDO($DSN,'root',''); ?>
hi everyone, did not know what to make the subject, but here is what I want to do: I have a string, which gets returned to me from a linux app on my server, it looks something like this: Code: [Select] <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <META HTTP-EQUIV="CONTENT-TYPE" CONTENT="text/html; charset=utf-8"> <TITLE> </TITLE> <META NAME="GENERATOR" CONTENT="OpenOffice.org 3.2 (Linux)"> <META NAME="AUTHOR" CONTENT="Administrator"> <META NAME="CREATED" CONTENT="20110106;14170000"> <META NAME="CHANGEDBY" CONTENT="HOD"> <META NAME="CHANGED" CONTENT="20110522;16540000"> <STYLE TYPE="text/css"> <!-- @page { margin: 0.26in } P { margin-bottom: 0.15in; direction: ltr; color: #000000; line-height: 0.15in; text-align: justify; widows: 2; orphans: 2 } P.western { font-family: "Arial", sans-serif; font-size: 10pt; so-language: en-US } P.cjk { font-family: "Batang", "바탕", serif; font-size: 10pt } P.ctl { font-family: "Times New Roman", serif; font-size: 10pt; so-language: ar-SA } A:link { color: #0000ff } --> </STYLE> </HEAD> <BODY LANG="en-US" TEXT="#000000" LINK="#0000ff" DIR="LTR" STYLE="border: 5.05pt double #000000; padding: 0.67in 0.92in"> <P>I want this and the tags around it, just not the html, head, body and their closing tags.</P> </BODY> </HTML> within the body, the tags are each styled for example: <p style="color: red"></p> so I cannot just get rid of all html, I want to get only all the content within the body tags, but without the body tags obviously strip_tags does not work as i need, I only want to strip certain tags. If someone can help me with this i will much appreciate it. i have 8 division (div), i want to display 4 rows in 4 division and the remain 4 rows in the next 4 division here is my code structure for carousel
<div class="nyie-outer"> second row third row
fourth row fifth row sixth row seven throw eighth row
</div><!--/.second four rows here-->
sql code
CREATE TABLE product( php code
<?php how can i echo that result in those rows
I am asking out of curiosity, how does this problem usually get solved, when using a tag system to sort content, and users enter similar tags. For example: flower and flowers... which means the difference between singular and plural. Judging by other sites which are around, this problem is not solved at all, they simply let you add as many tags as you want and then rank the most used tags, it indeed is a solution, but seems more like a walk-around solution to me. Any ideas how somebody could approach to solve this one? EDIT: My suggestion would be an analysis function, which analyzes the entered tag and then suggests the user that similar tags have been already entered and perhaps he wants to choose one of those which have been already entered. This does work though with a high traffic websites what can happen is the following: php and php5 You can end up with two similar tags which are both widely used though have different meanings to the user base. This one could be solved by simply prohibiting similar tags with little additions or changes, and so to speak "forcing" the user to choose something which is already there. May be a way, though it can turn out as a bad solution as well. Do anyone know how i can put the html tags in the same line as the other html tags? Here's an example: Code: [Select] Images | Link | Delete | Enabled On my code, it break the tags to the new line without put on the same line as the other tags. Here's the code: Code: [Select] [code]<?php session_start(); define('DB_HOST', 'localhost'); define('DB_USER', 'myusername'); define('DB_PASSWORD', 'mypass'); define('DB_DATABASE', 'mydbtable'); $errmsg_arr = array(); $errflag = false; $link = mysql_connect(DB_HOST, DB_USER, DB_PASSWORD); if(!$link) { die('Failed to connect to server: ' . mysql_error()); } $db = mysql_select_db(DB_DATABASE); if(!$db) { die("Unable to select database"); } function clean($var){ return mysql_real_escape_string(strip_tags($var)); } $username = clean($_GET['user']); $password = clean($_GET['pass']); if($username == '') { $errmsg_arr[] = 'username ID missing'; $errflag = true; } if($password == '') { $errmsg_arr[] = 'PASSWORD ID missing'; $errflag = true; } if($errflag) { $_SESSION['ERRMSG_ARR'] = $errmsg_arr; echo implode('<br />',$errmsg_arr); } else { $qry="SELECT * FROM members WHERE username='$username' AND passwd='$password'"; $result=mysql_query($qry) or die('Error:<br />' . $qry . '<br />' . mysql_error()); if(mysql_num_rows($result) > 0) { $qrytable1="SELECT images, id, public FROM members WHERE username='$username'"; $result1=mysql_query($qrytable1) or die('Error:<br />' . $qry . '<br />' . mysql_error()); while ($row = mysql_fetch_array($result1)) { echo '<p id="images"> <a href="images.php?id='.$row['id'].'">Images</a></td> | <a href="http://' . $row["links"] . '">Link</a> </td> | <a href="delete.php?id='.$row['id'].'">Delete</a> </td> | <p> <p id="test">'.$row['Public'].'</td>''; } } } ?>[/code] Say I have the following text stored in a MySQL database... Code: [Select] <b>Classic Quote from movie</b> and I retrieve it into a variable called $text, how do I properly echo that so that it keeps the bold tags and actually display the text "Classic quote from movie" in BOLD? I'm doing something wrong somewhere along the line (simply doing "echo $text;") because it displays on the page as... Code: [Select] <b>Classic Quote from movie</b> Instead of... Classic Quote from movie Any info on properly storing and echoing back HTML would be very appreciated. Hi All,
I'm very new to PHP and have been reading forums for the better half of two days trying to get ot the bottom of an issue I'm having with Contact form validation.
Problem: When submitting the form data, the information stored in a variable is not outputted to the webpage.
What I think I'm expecting: On form submission, the HTML5 elements should be checked to see if they are empty. If they are empty, the "string" that I'm storing in the *Err variables should then be outputted on the page to advise the use that the field has not been filled in.
Things I've tried: I've confirmed that Apache server is configured to allow HTML pages to be parsed as PHP and have verified that it's working by confirming that PHP scripts do run in the page, PHP includes within the HTML documents apply and that when I use <?php echo "Blah";?> on the page, it outputs correctly. When using a statement such as <?php echo $blah;?> or <?php echo "$blah";?> or <?php echo "{$blah}";?>, the content of the variable is not displayed to the user submitting the form. What am I doing wrong here? I'm trying to do this with just CSS, HTML5 and PHP - I've read about jquery and javascript but preference is to stay with the three above unless what I'm trying to do is not possible.
Any pointers/assistance would be hugely appreciated - I mustn't be understanding something correctly.
Cheers,
A
PHP Script: (P.S... I've intentionally left the mail component out until I get the form validating correctly).
<?php
htmlspecialchars($_SERVER["PHP_SELF"]); if ($_SERVER["REQUEST_METHOD"] == "POST") { if (empty($_POST["name"])) { $nameErr = "Name is required"; echo $nameErr; } else { $name = test_input($_POST["name"]); } if (empty($_POST["email"])) { $emailErr = "Email is required"; } else { $email = test_input($_POST["email"]); } if (empty($_POST["website"])) { $website = ""; } else { $website = test_input($_POST["website"]); } if (empty($_POST["phone"])) { $website = ""; } else { $website = test_input($_POST["phone"]); } if (empty($_POST["message"])) { $comment = ""; } else { $comment = test_input($_POST["message"]); } } function test_input($data) { $data = trim($data); $data = stripslashes($data); $data = htmlspecialchars($data); return $data; } ?> Markup: <form class="form-style-9" method="post" enctype="multipart/form-data"> <ul> <li>Contact Form</li> <li> <input type="text" name="name" required class="field-style field-split align-left" placeholder="Name"><span class="error">*<?php echo $nameErr;?></span> <input type="email" name="email" required class="field-style field-split align-right" placeholder="Email"> </li> <li> <input type="tel" name="phone" required class="field-style field-split align-left" placeholder="Phone"> <input type="url" name="website" class="field-style field-split align-right" placeholder="Website"> </li> <li> <input type="text" maxlength="20" min="5" name="subject" required class="field-style field-full align-none" placeholder="Subject"> </li> <li> <textarea name="message" maxlength="200" required class="field-style" placeholder="Message"></textarea> </li> <li> <input id="submit" name="submit" type="submit" value="Send Message"> </li> </ul> </form> Edited by ahphpnz, 18 January 2015 - 08:15 PM. Evening Everyone,
Been working on this problem for a couple of days and I am stumped. I have a single php file to handle download and streaming of files. It works great with music files, I can download and stream to an <audio> html 5 element just fine. When it comes to my movies, I can download fine but it fails on streaming to a <video> html 5 element. I have done some logging and it looks like after a very short time it just quits.
log when streaming music:
/path/to/music/124 - Mouth Techno -1.mp3 size: 1508731 ctype: audio/mpeg range: 0-1508730/1508731 write chunk: 8192-1508731 write chunk: 16384-1508731 .... write chunk: 1507328-1508731 write chunk: 1515520-1508731 completedlog when streaming movie - this is the complete output, it just stops: Log Started /path/to/movies/AVP_REQUIEM_UNRATED.Title1.DVDRip.mp4 size: 889628920 ctype: video/mp4 range: 0-889628919/889628920 write chunk: 8192-889628920 write chunk: 16384-889628920 write chunk: 24576-889628920 write chunk: 32768-889628920 write chunk: 40960-889628920 write chunk: 49152-889628920 write chunk: 57344-889628920 write chunk: 65536-889628920Here is how I am downloading and streaming the files. Music files work just fine with <audio>, movie files I can only download but want to stream with <video>. This is a hack from multiple sources on the net.
<?php
// sanitize the file request, keep just the name and extension
$filename = $filefix = str_replace('%20', ' ', $_GET["name"]);
$file_path = $filename;
$path_parts = pathinfo($file_path);
$file_dir = $path_parts['dirname'];
$file_name = $path_parts['basename'];
$file_ext = $path_parts['extension'];
$path_default = "/path/to/music/";
$path_types = array(
"mp3" => "/path/to/music/",
"mpg" => "/path/to/movies/",
"avi" => "/path/to/movies/",
"mp4" => "/path/to/movies/",
);
$path = isset($path_types[$file_ext]) ? $path_types[$file_ext] : $path_default;
$file_path = "$path"."$filename";
clearLog();
startLog();
writeLog("$file_path\n");
// allow a file to be streamed instead of sent as an attachment
$is_attachment = isset($_GET["play"]) ? false : true;
// make sure the file exists
if (is_file("$file_path")){
$file_size = filesize($file_path);
$file = @fopen($file_path,"rb");
writeLog("size: $file_size\n");
if ($file){
header("Expires: -1");
header("Cache-Control: public, must-revalidate, post-check=0, pre-check=0");
// set appropriate headers for attachment or streamed file
if ($is_attachment){
header("Content-Disposition: attachment; filename=\"$file_name\"");
}else{
header('Content-Disposition: inline;');
}
// set the mime type based on extension.
$ctype_default = "application/octet-stream";
$content_types = array(
"exe" => "application/octet-stream",
"zip" => "application/zip",
"mp3" => "audio/mpeg",
"mpg" => "video/mpeg",
"avi" => "video/x-msvideo",
"mp4" => "video/mp4",
);
$ctype = isset($content_types[$file_ext]) ? $content_types[$file_ext] : $ctype_default;
header("Content-Type: " . $ctype);
writeLog("ctype: $ctype\n");
$end = ($file_size - 1);
$start = 0;
header("Content-Length: $file_size");
header('Accept-Ranges: bytes');
header("Content-Range: bytes $start-$end/$file_size");
writeLog("range: $start-$end/$file_size\n");
$a=0;
while(!feof($file)) {
$chunk = (1024*8);
echo fread($file, $chunk);
//ob_flush();
flush();
$a=$a+$chunk;
writeLog("write chunk: $a-$file_size\n");
if (connection_status()!=0){
writeLog("failed\n");
fclose($file);
exit;
}
}
// file save was a success
writeLog("completed\n");
fclose($file);
exit;
}else{
// file couldn't be opened
header("HTTP/1.0 500 Internal Server Error");
exit;
}
}else{
// file does not exist
header("HTTP/1.0 404 Not Found");
exit;
}
function startLog(){
$myfile = fopen("newfile.txt", "w");
fwrite($myfile, "Log Started\n");
fclose($myfile);
}
function writeLog($pstr) {
$myfile = fopen("newfile.txt", "a");
fwrite($myfile, $pstr);
fclose($myfile);
}
function clearLog() {
//fclose("newfile.txt");
unlink("newfile.txt");
}
?>
incase it helps, code calling download.php
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="movies.css">
</head>
<body>
<a href="javascript:history.back()"><img src="pics/back.png" style=\"height:50px; width=50px;\"/></a>
<a href="index.html"><img src="pics/home.png" style="height:50px; width=50px;display: in-line;"/></a>
<div id="searchContainer" style="height: 40px; width = 700px; display: block; padding: 10px;">
<input type="text" id="SearchString" placeholder="Enter Search Address" style="vertical-align: top;padding: 10px;" class="valid">
<button name="btnSearch" id="btnSearch" type="button"></button>
</div>
<div id="Mainbox" >
<div id="ItemList">
<ol id="List">
<?php
$dir = '/path/to/movies/';
$dirlist = array_diff(scandir($dir), array('..', '.','Thumbs.db'));
asort($dirlist);
$a=0;
foreach ($dirlist as $file) {
$size = round(filesize('/path/to/movies/'.$file)/1048576);
$filefix = str_replace(' ', '%20', $file);
echo "<li><div class=\"item\" id=\"$a\">";
//title
echo "<div id=\"title\">$file</div>";
echo "<div id=\"mb\">$size MB</div>";
echo "<div id=\"dl\"><a href=\"download.php?name=$filefix\"><img src=\"pics/download.png\" style=\"height:25px; width=25px;\"/></a></div>";
if ($size < 1500){
$url = 'download.php?name='.$filefix.'&play=true';
echo "<div id=\"play\" data-value=\"$url\"><a href=\"javascript:void(0)\" onClick=\"updateSource(this);\"><img src=\"pics/play.png\" style=\"height:25px; width=25px;\"/></a></div>";
}
echo "</div></li>";
$a++;
}
?>
</ol>
</div>
</div>
<div id="videocontainer">
<video id="video" controls>
<source id="mp4movie" type="video/mp4">
<source src="movie.ogg" type="video/ogg" codecs="avc1.64001E, mp4a.40.2">
Your browser does not support the video tag.
</video>
</div>
<script type="text/javascript">
function updateSource(element) {
var dvalue = element.parentElement.getAttribute('data-value');
var video = document.getElementById('video');
var source = document.getElementById('mp4movie');
source.src=dvalue;
video.load(); //call this to just preload the audio without playing
video.play(); //call this to play the song right away
}
</script>
</body>
</html>
Thanks for any help!
Edited by AdrianHoffman, 27 September 2014 - 11:51 PM. Hi,
I've got a "data.txt" file with the following content:
One1:One2:One3:One4:One5:One6 Two1:Two2:Two3:Two4:Two5:Two6 Three1:Three2:Three3:Three4:Three5:Three6Now I want to be able to take each data and put on a specific location of a htlm code. Each line for its own. So for the first line, it should look something like this: <html> <head> <title></title> <head> <body> <h1>One2</h1> <h2>One4 some other Text One5</h2> <img src="One6.jpg"> </body> </html>Unforturtunately I don't have a clue how to do that. Can anybody help me out or does someone know a good and easy tutorial? Thanks a lot |
|||||||