I am creating a wordpress theme with theme options in wordpress. I like to add a dynamic add and remove textbox using jquery inside the theme settings page. My query is,
theme_settings.php
<?php
function theme_settings_init(){
register_setting( 'theme_settings', 'theme_settings' );
}
function add_settings_page() {
add_menu_page( __( 'Theme Settings' ), __( 'Theme Settings' ), 'manage_options', 'settings', 'theme_settings_page');
}
//add actions
add_action( 'admin_init', 'theme_settings_init' );
add_action( 'admin_menu', 'add_settings_page' );
//start settings page
function theme_settings_page() {
if ( ! isset( $_REQUEST['updated'] ) )
$_REQUEST['updated'] = false;
?>
<div>
<div id="icon-options-general"></div>
<h2><?php _e( 'Theme Settings' ) //your admin panel title ?></h2>
<?php
//show saved options message
if ( false !== $_REQUEST['updated'] ) : ?>
<div><p><strong><?php _e( 'Options saved' ); ?></strong></p></div>
<?php endif; ?>
<form method="post" action="options.php">
<?php settings_fields( 'theme_settings' ); ?>
<?php $options = get_option( 'theme_settings' ); ?>
<div id='TextBoxesGroup'>
<?php
$counter = 1;
while (get_option('textbox'.$counter) && $counter <= 10) {
echo '<div id="TextBoxDiv'.$counter.'">
<input type="textbox" id="theme_settings[textbox'.$counter.'] name="theme_settings[textbox'.$counter.']" >
</div>';
$counter++;
}
?>
</div>
<input type='button' value='Add Button' id='addButton'>
<input type='button' value='Remove Button' id='removeButton'>
<p><input name="submit" id="submit" value="Save Changes" type="submit"></p>
</form>
</div><!-- END wrap -->
<?php
}
and my javascript file is:
$(document).ready(function(){
var counter = 2;
$("#addButton").click(function () {
if(counter>10){
alert("Only 10 textboxes allow");
return false;
}
var newTextBoxDiv = $(document.createElement('div'))
.attr("id", 'TextBoxDiv' + counter);
$('<div id="TextBoxDiv'+counter+'"></div>').append(
'<input type="text" name="theme_settings[textbox' + counter +
']" id="theme_settings[textbox' + counter + ']" value="" >').appendTo('#TextBoxesGroup');
newTextBoxDiv.appendTo("#TextBoxesGroup");
counter++;
});
$("#removeButton").click(function () {
if(counter==1){
alert("No more textbox to remove");
return false;
}
counter--;
$("#TextBoxDiv" + counter).remove();
});
$("#getButtonValue").click(function () {
var msg = '';
for(i=1; i<counter; i++){
msg += "\n Textbox #" + i + " : " + $('#textbox' + i).val();
}
alert(msg);
});
});
Now my question is, In the theme settings page, the add action and remove action works very fine but while saving the theme setting options the added textbox dissappears. It happens while refreshing the page too.
Please anyone help me how to keep those added textbox remains same if saving the theme options page.
Use .append() instead of .after().html(). This way your code goes inside the corresponding div element. I made use of jQuery also.
newTextBoxDiv.after().html(
'<input type="text" name="theme_settings[textbox' + counter +
']" id="theme_settings[textbox' + counter + ']" value="" >');
should be
$('<div id="TextBoxDiv'+counter+'"></div>').append(
'<input type="text" name="theme_settings[textbox' + counter +
']" id="theme_settings[textbox' + counter + ']" value="" >').appendTo('#TextBoxesGroup');
To make the text boxes appear you need a while loop like this:
$counter = 1;
while (get_option('textbox'.$counter) && $counter <= 10) {
echo '<div id="TextBoxDiv'.$counter.'">
<input type="textbox" id="theme_settings[textbox'.$counter.'] name="theme_settings[textbox'.$counter.']" >
</div>';
$counter++;
}
When you save them you could do this:
$counter = 0;
while (isset($_POST['theme_settings']['textbox'.$counter']) && $counter <= 10) {
update_option('textbox'.$counter, $_POST['theme_settings']['textbox'.$counter']);
$counter++;
}
// now remove the rest of them if they were previously set
// for example we now set only 5 of them and there were 10 before
// continue with counter from where we left in the previous while loop
while ($counter <= 10) {
update_option('textbox'.$counter, false);
$counter++;
}
EDIT:
function theme_settings_page() {
$updated = false;
if (isset($_REQUEST['updated'])) {
update_option('theme_settings', $_POST['theme_settings']);
$updated = true;
}
// ....
if ($updated) {
echo '<div><p><strong>';
_e( 'Options saved' );
echo '</strong></p></div>';
}
$counter = 1;
$options = get_option('theme_settings');
while (isset($options['textbox'.$counter])) {
echo '<div id="TextBoxDiv'.$counter.'">
<input type="textbox" id="theme_settings[textbox'.$counter.'] name="theme_settings[textbox'.$counter.']" value="'.$options['textbox'.$counter].'" />
</div>';
$counter++;
}
echo '<input type="hidden" name="updated" value="1" />';
// the rest of your form
}
Related
I have a loop in php and I'm using a js function onclick to get the id from the php loop. I do loop in js to recognize a php dynamic id, but it recognizes the wrong order of the loop item.
Sample php code:
$list = 1;
for ($i = 0; $i < 7; $i++ ){
$listNo = $list;
$list++;
$html .= "<div class='row l'>";
$html .= " <div class='col-xl-3 col-lg-8 col-6'>
<input name=']' id='dm_slider_img_url_$listNo' type='text' value='" . $dm_slides[++$counter] . "'/>
<button class='set_custom_images' id='meta-image-button-$listNo'>
<span class='dashicons dashicons-plus-alt'></span>
</button>
</div>
<div class='col-xl-1 col-lg-4 col-6 mr-auto'>
<img id='dm_slider_img_preview_$listNo' src='" . $dm_slides[$counter++] . "' name=''>
</div>";
$html .= "</div>";
}
Sample js code:
var send_attachment_bkp = wp.media.editor.send.attachment;
for (let ids=1; ids<8; ids++) {
if ($('#meta-image-button-'+ids).length > 0) {
if ( typeof wp !== 'undefined' && wp.media && wp.media.editor) {
$(document).on('click', '.set_custom_images', function(e) {
e.preventDefault();
var button = $(this);
var id = button.prev();
wp.media.editor.send.attachment = function(props, attachment) {
$('#dm_slider_img_url_'+ids).val(attachment.url);
$('#dm_slider_img_preview_'+ids).attr('src',attachment.url);
wp.media.editor.send.attachment = send_attachment_bkp;
};
wp.media.editor.open(button);
return false;
});
}
}
}
What am I doing wrong?
After looking other questions related to getting id, I figured it out. After calling click function using button class, I stored it as variable and added this variable.
$(document).ready(function() {
var $ = jQuery;
// var ids = 1;
// $(«.set_custom_images»).onclick = function(t) {t.attr(«id»)}
var send_attachment_bkp = wp.media.editor.send.attachment;
if ($("[id^='meta-image-button-']" ).length > 0) {
if ( typeof wp !== 'undefined' && wp.media && wp.media.editor) {
$(document).on('click', '.set_custom_images', function(e) {
var clickedID = this.id;
e.preventDefault();
var button = $(this);
var id = button.prev();
wp.media.editor.send.attachment = function(props, attachment) {
$('#dm_slider_img_url_'+clickedID).val(attachment.url);
$('#dm_slider_img_preview_'+clickedID).attr('src',attachment.url);
wp.media.editor.send.attachment = send_attachment_bkp;
};
wp.media.editor.open(button);
return false;
});
}
}
});
And in php make some changes
$list = 1;
for ($i = 0; $i < 7; $i++ ){
$listNo = $list;
$list++;
$html .= "<div class='row l'>";
$html .= " <div class='col-xl-3 col-lg-8 col-6'>
<input name='' id='dm_slider_img_url_m_$listNo' type='text' value='" . $dm_slides[++$counter] . "'/>
<button class='set_custom_images' id='m_$listNo'>
<span class='dashicons dashicons-plus-alt'></span>
</button>
</div>
<div class='col-xl-1 col-lg-4 col-6 mr-auto'>
<img id='dm_slider_img_preview_m_$listNo' src='" . $dm_slides[$counter++] . "' name=''>
</div>";
$html .= "</div>";
}
I hope this will help for someone who searches solution like this
I have some checkboxes (101) which labels should change based on a select input. The JS I have only runs for one, which is logical. Though I'm not very familiar with jquery functions, I don't know how to proceed for all the 101 checkboxes.
the inputs :
<?php
for ($i = 1; $i < 102; $i++): //adjust this number to whatever number of checkboxes you want
echo '<div class="each_checkboxes">';
// $j = sprintf('%04u', $i);
echo '<label id="contact" for="checkbox"></label>';
echo '<input type="checkbox" name="tape[]" id="checkbox" value=""/>';
echo '</div>';
endfor;
?>
the select :
<select id="method" name="server" class="custom-dropdown__select custom-dropdown__select--white" required>
<option value="0" default>Choose server</option>
<option value="server1">server 1</option>
<option value="server2">server 2</option>
</select>
the js :
$(document).ready(function () {
$('#method').change(function () {
var method = $('option:selected').val();
if (method == "server1") {
$('#contact').text("MA" + i);
} else if (method == "server2") {
$('#contact').text("SAS" + i);
}
});
});
You need to use class instead of id, because id should be unique for each element. Try like following.
PHP:
<?php
for ($i = 1; $i < 102; $i++):
echo '<div class="each_checkboxes">';
echo '<label class="contact" for="checkbox'.$i.'"></label>';
echo '<input type="checkbox" name="tape[]" id="checkbox'.$i.'" value=""/>';
echo '</div>';
endfor;
?>
jQuery:
$(document).ready(function () {
$('#method').change(function () {
var method = $('option:selected').val(),
text = "";
if (method == "server1") {
text = "MA";
} else if (method == "server2") {
text = "SAS";
}
$('.contact').each(function (i) {
var value = text + (++i);
$(this).text(value);
$('#' + $(this).attr('for')).val(value);
});
});
});
You are referencing to id attribute in your jQuery selector which will only look for first match in your dom You need to assign a class to your label and reference to that when changing you label text then this will work.
<?php
for ($i = 1; $i < 102; $i++): //adjust this number to whatever number of checkboxes you want
echo '<div class="each_checkboxes">';
// $j = sprintf('%04u', $i);
echo '<label id="contact" class="contact" for="checkbox"></label>';
echo '<input type="checkbox" name="tape[]" id="checkbox" value=""/>';
echo '</div>';
endfor;
?>
and in jQuery just use class selector like this;
$(document).ready(function () {
$('#method').change(
function () {
var method = $('option:selected').val();
if (method == "server1") {
$('.contact').text("MA" + i);
} else if (method == "server2") {
$('.contact').text("SAS" + i);
}
});
});
That's it.
Use label class instead of id
<?php
for ($i = 1; $i < 102; $i++): //adjust this number to whatever number of checkboxes you want
echo '<div class="each_checkboxes">';
// $j = sprintf('%04u', $i);
echo '<label class="contact" for="checkbox"></label>';
echo '<input type="checkbox" name="tape[]" id="checkbox" value=""/>';
echo '</div>';
endfor;
?>
js code is
$(document).ready(function () {
$('#method').change(
function () {
var method = $('option:selected',this).val();
if (method == "server1") {
$('.each_checkboxes label.contact').html("MA" + i);
} else if (method == "server2") {
$('.each_checkboxes label.contact').html("SAS" + i);
}
});
});
Use "class" for your checkbox's label instead of "id". Basically, "id" of an element should be unique. But class, more than one elements can have the same class.
So, the label should be like this:
<label class="contact" for="checkbox"></label>
Then your onchange method should be like this:
$('#method').change(
function () {
var method = $('option:selected').val();
if (method == "server1") {
$('.contact').text("MA" + i);
} else if (method == "server2") {
$('.contact').text("SAS" + i);
}
});
I'm new here and I ask for your understanding
I am downloading from the script :
echo '<div id="xx">';
if ($nazwa == "1234") {
$nazwa_color = "red";
} else {
$nazwa_color = "black";
}
echo '<div style="padding-left:0px;float:left;margin-left:1px;"><input type="text" autocomplete="off"
style="font-family:Tahoma;text-indent:2px;text-align:left;font-size:12px;width:500px;height:29px;background-color : White ; color : ' . $nazwa_color . ';border-width:1px;border-style:ridge;border-color:rgb(208,208,208);"
name="nazwa" value="b" class="wyk_edit"></div>';
echo'</div>';
And in javascript :
$(this).parent().parent().parent().find(".xx").load("setup-wyklady/wyk_edit_proces.php #xx");
does not address the condition 'if'. Why?
Thanks, but not working. Maybe I show all.
This is the portion of the file that you want to replace the method of load:
$wyk_query1 = mysql_query("SELECT * FROM nazwy_wyklady WHERE id_wykladu <> 9999 ORDER BY nr") or die('Błąd zapytania');
while($wyk=mysql_fetch_array($wyk_query1)){ //begin loop
$id_wykladu=$wyk['id_wykladu'] ;
$nr=$wyk['nr'] ;
$nazwa=$wyk['nazwa'] ;
echo '<form action="../wyklady/setup-wyklady/wyk_edit_proces.php" method="post"> ';
echo '<div style="float:left;width:590px;margin-top:2px;background:none" >';
echo '<div style="padding-left:0px;float:left;margin-left:1px;"><input type="text" readonly="readonly"
style="font-family:Tahoma;text-indent:2px;text-align:center;font-size:12px;width:30px;height:29px;background-color : White ; color : black;border-width:1px;border-style:ridge;border-color:rgb(208,208,208);"
name="nr" value="'.$nr.'" class="wyk_edit_nr"></div>';
if($nazwa=="1234")
{
$nazwa_color = "red" ;
}
else
{
$nazwa_color = "black" ;
}
echo '<div style="padding-left:0px;float:left;margin-left:1px;" class="xx"><input type="text" autocomplete="off"
style="font-family:Tahoma;text-indent:2px;text-align:left;font-size:12px;width:500px;height:29px;background-color : White ; color : '.$nazwa_color.';border-width:1px;border-style:ridge;border-color:rgb(208,208,208);"
name="nazwa" value="'.$nazwa.'" class="wyk_edit"></div>';
echo '<div style="float:left;margin-left:15px;margin-top:1px;" >
<input style="display:none;cursor:pointer;width:25px;height:25px;background-color:White;color:rgb(193,135,107);" id="edit_button" title="zatwierdź zmiany" value="" class="wyk_edit_button"></div>' ;
echo '<input type="hidden" name="id_wykladu" value="'.$id_wykladu.' " class="wyk_edit_id"> ';
echo '</div>'; // 2a
echo '</form> ';
} //end of loop
and a script that loads (wyk_edit_proces.php):
$wyk_query1 = mysql_query("SELECT * FROM nazwy_wyklady WHERE id_wykladu ='$id_wykladu1'") or die('Błąd zapytania');
$wyk=mysql_fetch_array($wyk_query1) ;
$id_wykladu=$wyk['id_wykladu'] ;
$nr=$wyk['nr'] ;
$nazwa=$wyk['nazwa'] ;
echo '<form action="../wyklady/setup-wyklady/wyk_edit_proces.php" method="post"> ';
echo '<div style="float:left;width:590px;margin-top:2px;background:none" >';
echo '<div style="padding-left:0px;float:left;margin-left:1px;"><input type="text" readonly="readonly"
style="font-family:Tahoma;text-indent:2px;text-align:center;font-size:12px;width:30px;height:29px;background-color : White ; color : black;border-width:1px;border-style:ridge;border-color:rgb(208,208,208);"
name="nr" value="'.$nr1.'" class="wyk_edit_nr"></div>';
if($nazwa=="1234")
{
$nazwa_color = "red" ;
}
else
{
$nazwa_color = "black" ;
}
echo '<div style="padding-left:0px;float:left;margin-left:1px;"><input type="text" autocomplete="off"
style="font-family:Tahoma;text-indent:2px;text-align:left;font-size:12px;width:500px;height:29px;background-color : White ; color : '.$nazwa_color.';border-width:1px;border-style:ridge;border-color:rgb(208,208,208);"
name="nazwa" value="b" class="wyk_edit"></div>';
echo '<div style="float:left;margin-left:15px;margin-top:1px;" >
<input style="display:none;cursor:pointer;width:25px;height:25px;background-color:White;color:rgb(193,135,107);" id="edit_button" title="zatwierdź zmiany" value="" class="wyk_edit_button"></div>' ;
echo '<input type="hidden" name="id_wykladu" value="'.$id_wykladu.' " class="wyk_edit_id"> ';
echo '</div>';
echo '</form> ';
and javascript:
<script>
//-----------------------------------------------------------------ajax - wykłady
$(document).ready(function(){
$(".wyk_edit_button").click(function () {
var id_wykladu1 = $(this).parent().parent().parent().find(".wyk_edit_id").val();
var nr1 = $(this).parent().parent().parent().find(".wyk_edit_nr").val();
var nazwa1 = $(this).parent().parent().parent().find(".wyk_edit").val().trim();
// alert(id_wykladu1 + " " + nr1 + " " + nazwa1)
if(nazwa1 == "")
{
alert("puste");
}
else
{
$.ajax({
type : "POST",
url : "setup-wyklady/wyk_edit_proces.php",
data : {
id_wykladu : id_wykladu1,
nr : nr1,
nazwa : nazwa1
},
context: this,
success : function() {
$(this).parent().parent().parent().find(".wyk_edit").load("setup-wyklady/wyk_edit_proces.php", function(){
alert("Done");
});
if (!$(".popup:visible").length) {
$(".popup").fadeIn(1);
}
},
complete : function(r) {
},
error: function(error) {
}
});
}
});
$(".popup .bg, .popup .container").click(function() {
$(".popup").fadeOut(250);
});
});
</script>
What you think about async:false ?
It's because the jQuery .load-Method works asynchronus as mentioned in this article. Try to use the invoked callback-function:
$(randomstuff).load("test",function()
{
alert("I'm done");
}
hi guys I am pretty newbish in javascript and php for that matter. I am making a page where user will choose either to create a radio or input fields for others to solve.
Everything works fine except, when I save the form, fields are not in the order I added them because I first loop over the 'input' fields and then over the 'radio' fields. I know this is probably not the way to do it, feel free to give me an alternative.
Any help would be appreciated, thanks in advance.
VIEW
<h1>Add questions</h1>
<form action="" method="post">
<div id='pit'>
<span id="add_input"><a href="#" class='button' style='font-size:1.5em;'><span>» add input </span></a></span><br>
<span id="add_radio"><a href="#" class='button'style='font-size:1.5em;'><span>» Dodaj yes/no question</span></a></span>
</div>
<input type="hidden" name="id" value="<?= $this->uri->segment(3); ?>" />
<input id="go" class="button" name="submit" type="submit" value="Save" />
</form>
<script type="text/javascript">
var count = 0;
var a=0;
$(function(){
$('span#add_input').click(function(){
count += 1;
$('#pit').append('<p><strong>Pitanje #' + count + '</strong>'+ '<input id="field_' + count + '" name="fields[]' + '" type="text" /></p>' );
a=count;
document.write(a);
});
});</script>
<script type="text/javascript">
var count = 0;
$(function(){
$('span#add_radio').click(function(){
count += 1;
$('#pit').append('<p><strong>DA/NE #' + count + '</strong>'+ '<input id="radio_' + count + '" name="radios[]' + '" type="text" /></p>' );
});
});</script>
CONTROLLER
$id=$this->input->post('id');
if($_POST['fields']){
foreach ( $_POST['fields'] as $key=>$value ) {
$tip='input';
if($value!=''){
$this->page_model->add_questions($id,$value,$tip);
}
}
}
if($_POST['radios']){
foreach ( $_POST['radios'] as $key=>$value ) {
$tip='radio';
if($value!=''){
$this->page_model->add_questions($id,$value,$tip);
}
}
}
Something like this might work.
Maintain the same count variable in the JavaScript to keep track of which input is created.
Instead of using name="fields[]", use name="field_' + count + '" so you can iterate with a loop in the controller.
VIEW
<script type="text/javascript">
var count = 0;
var a=0;
$(function(){
$('span#add_input').click(function(){
count += 1;
$('#pit').append('<p><strong>Pitanje #' + count + '</strong>'+ '<input name="field_' + count + '" type="text" /></p>' );
a=count;
document.write(a);
});
$('span#add_radio').click(function(){
count += 1;
$('#pit').append('<p><strong>DA/NE #' + count + '</strong>'+ '<input name="radio_' + count + '" type="text" /></p>' );
});
});
</script>
CONTROLLER
Use a regular expression to extract the necessary values.
$inputs = array();
$id=$this->input->post('id');
foreach($_POST as $key => $value) {
$matches = array();
if (preg_match('/(field|radio)_([\d]+)', $key, $matches)) {
$tip = $matches[1];
$count = $matches[2];
$inputs[$count] = array($id, $value, $tip);
}
}
Loop through the new $inputs array to call your add_questions method.
ksort($inputs);
foreach($inputs as $array) {
$id = $array[0];
$value = $array[1];
$tip = $array[2];
$this->page_model->add_questions($id,$value,$tip);
}
I try to make web app for creating radio button questions (like survey). The problem is defining the array of radio button options in order to call it on php page and display it in the desirable order.
In my example below, I only got one radio button of each question, and I want to display all radio buttons input on the index.html page.
This should work like this: User opens index.html, there he add the first question (button Add Question) and the proposal of answers (for example 3, which he will get by pressing the Add option button and inserting text of it). The same he should do and for the question number 2, etc...
After that, by clicking PROCEED, it should lead him to the process.php page where the survey will display radio buttons questions. But there is a mistake, please see it on the link or in the code below:
LINK FOR TESTING
index.html
<script src="script.js"></script>
<form action="http://www.balkanex.info/atest/radio/process.php" method="post">
Here is the page with which you can add your new radio button questions for survey.
<input type="button" value="ADD NEW QUESTION" onclick="addradio();">
<div id="mydiv"></div>
<br/>
<input type="submit" name="submit" value="PROCEED"><br/>
</form>
script.js
n=1;
var m = 1;
var moreradio = '<br/><input type="button" onclick="addmoreradio()" value="Add option">';
function addradio() {
m = 1;
var textarea = document.createElement("textarea");
textarea.name = "question[" + n + "]";
textarea.rows = 1;
textarea.cols = 60;
var div = document.createElement("div");
div.innerHTML = n + '. Question: ' + '<br />' + 'Que: ' + textarea.outerHTML + moreradio + '<br/><div id="opid' + n + '"' + '></div><br /><br/>';
document.getElementById("mydiv").appendChild(div);
n++;
r = n-1;
}
function addmoreradio() {
var radio = '<input type="text" name="tag' + r + m + '"><br/>';
document.getElementById("opid"+r).innerHTML += radio;
m++
}
process.php
<?php
$question = $_POST['question'];
$length = count($_POST['question']);
$r=1;
for($j=1; $j<$length+1; $j++) {
if($_POST['question'][$j] != "") {
$radioarray = $_POST['tag'];
$area = '<input type="radio" name="'.$r.'" value="'.$r.'">'.$radioarray$j$r.'<br/>';
$bla .= $j.') '.$question[$j].'<br/>'.$area.'<br/><br/>';
$r++;
}}
$content = $bla;
echo $content;
?>
You can did a mistake on form side while naming elements. Also you did mistake on backend while iterating. You can use following;
JS:
<script>
var m = 0;
function addradio() {
var textarea = document.createElement("textarea");
textarea.name = "question[]";
textarea.rows = 1;
textarea.cols = 60;
var div = document.createElement("div");
div.innerHTML = m + '. Question: ' + '<br />' + 'Que: ' + textarea.outerHTML + '<br/><input type="button" onclick="addmoreradio(' + m + ')" value="Add option">' + '<br/><div id="opid' + m + '"' + '></div><br /><br/>';
document.getElementById("mydiv").appendChild(div);
m++;
}
function addmoreradio(question_id) {
var radio = '<input type="text" name="tag' + question_id + '[]"><br/>';
document.getElementById("opid" + question_id).innerHTML += radio;
}
</script>
HTML:
<script src="script.js"></script>
<form action="http://www.balkanex.info/atest/radio/process.php" method="post">
Here is the page with which you can add your new radio button questions for survey.
<input type="button" value="ADD NEW QUESTION" onclick="addradio();">
<div id="mydiv"></div>
<br/>
<input type="submit" name="submit" value="PROCEED"><br/>
</form>
PHP:
<?php
$question = $_POST['question'];
$content = '';
foreach ($question as $k => $v) {
$area = '';
$options = $_POST["tag" . $k];
foreach ($options as $key => $val) {
$area .= '<input type="radio" name="tag[]" value="'. $key .'">' . $val . '<br/>';
}
$content .= $k + 1 . ') ' . $question[$k].'<br/>'.$area.'<br/><br/>';
}
echo $content;
?>