<?php require 'includes/verifycred.php'; ?>

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

    <meta charset="utf-8" />
    <link rel="stylesheet" href="style.css" type="text/css" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script type="text/javascript" src="wysiwyg.js"></script> 

<body class="body" onLoad="iFrameOn();">

<header class="mainHeader">

                    <a href="adminpage.php">ADMIN PANEL</a>



<?php include 'sideBar.php' ?>

        <div class="content">

            <article class="topcontent">

                <h3 align="center">New Article</h3>

                <form action="addarticle.php" name="myform" id="myform" method="POST">

                <p> Title <br> <input type="text" name="title" id="title" size="80" maxlength="80" /> <br> </p>

                <p> Category <br>
                <select name="category" id="category">
                    <option value="computers">Computers</option>
                    <option value="smartphones">Smartphones</option>

                <div id="wysiwyg_cp" style="padding:8px; width:700px;">
                    <input type="button" onClick="iBold()" value="B">
                    <input type="button" onClick="iUnderline()" value="U">
                    <input type="button" onClick="iItalic()" value="I">
                    <input type="button" onClick="iFontSize()" value="Text Size">
                    <input type="button" onClick="iForeColor()" value="Text Color">
                    <input type="button" onClick="iHorizontalRule()" value="HR">
                    <input type="button" onClick="iUnorderedList()" value="UL">
                    <input type="button" onClick="iOrderedList()" value="OL">
                    <input type="button" onClick="iLink()" value="Link">
                    <input type="button" onClick="iUnLink()" value="Unlink">
                    <input type="button" onClick="iImage()" value="Image">

                <textarea style="display:none;" maxlenght="5000" name="myTextArea" id="myTextArea" cols="100" rows="14"></textarea></p>
                <!-- this textarea is hidden, iframe replaces it -->
                <iframe name="richTextField" id="richTextField" style="border:#000000 1px solid; width:700px; height:300px;"></iframe>
                <input type="submit" name="myBtn" value="Submit" onClick="javascript:submit_form();"/>



<footer class="mainFooter">
    <p>Copyright &copy; 2014</p>




                if (isset($_POST['myBtn'])){

                     $time = time() + 25200;

                     $articles_date = date('Y-m-d h:i:s', $time);
                     $articles_title = htmlentities($_POST['title']);
                     $articles_category = $_POST['category'];
                     $articles_content = $_POST['myTextArea'];

                    if ($articles_title=='' or $articles_content==''){
                        echo "<script>alert('All fields are required.')</script>";
                        //echo '<center><b><font color="red">All fields are required.</font></b></center>';
                        //header("Location: comments.php");


                    $insert_query = "insert into articles(articles_date, articles_title, 
                    articles_category, articles_content) 
                    values('$articles_date', '$articles_title', 
                    '$articles_category', '$articles_content')";


                        echo "<script>alert('New article added successfully.')</script>";
                        //header("Location: addarticle.php");


Here is the script:

function iFrameOn(){
    //targetting the iframe
    richTextField.document.designMode = 'On';
function iBold(){
    richTextField.document.execCommand('bold', false, null);
function iUnderline(){
    richTextField.document.execCommand('underline', false, null);
function iItalic(){
    richTextField.document.execCommand('italic', false, null);
function iFontSize(){
    var size = prompt('Enter a size 1- 7', '');
    richTextField.document.execCommand('FontSize', false, size);
function iForeColor(){
    var color = prompt('Enter a basic color or hex color code:', '');
    richTextField.document.execCommand('ForeColor', false, color);
function iHorizontalRule(){
    richTextField.document.execCommand('inserthorizontalrule', false, null);
function iUnorderedList(){
    richTextField.document.execCommand("InsertOrderedList", false, "newOL");
function iOrderedList(){
    richTextField.document.execCommand("InsertUnorderedList", false, "newUL");
function iLink(){
    var linkURL = prompt("Enter the URL:", "http://");
    richTextField.document.execCommand("CreateLink", false, linkURL);
function iUnLink(){
    richTextField.document.execCommand("Unlink", false, null);
function iImage(){
    var imgSrc = prompt('Enter the image URL:', 'http://');
        richTextField.document.execCommand('insertimage', false, imgSrc);
function submit_form(){
    var theForm = document.getElementById("myform");
    theForm.elements["myTextArea"].value = window.frames['richTextField'].document.body.innerHTML;

this works perfectly, adding the 4 fields (title, date, category and content) into database, how can i fetch them when i want to edit them? Can i call the content (full of html tags) and place it on temporary textarea then automatically duplicate it into enabled iframe for edtting? Tell me a better way and the functions i can use. Im a great newbie.

3 Years
Discussion Span
Last Post by 2mhzbrain
This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.