PDA

View Full Version : PHP و JQUERY


mehdi4467
سه شنبه 06 مرداد 1394, 13:55 عصر
سلام
من یک اسلایدر بار می خوام داشته باشم که با jquery نوشته شده است. کد به شکل زیر:



<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Slider - Range slider</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
$( "#slider-range" ).slider({
range: true,
min: 0,
max: 500,
values: [ 75, 300 ],
slide: function( event, ui ) {
$( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
}
});
$( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
" - $" + $( "#slider-range" ).slider( "values", 1 ) );
});
</script>
</head>
<body>

<p>
<label for="amount">Price range:</label>
<input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;">
</p>

<div id="slider-range"></div>


</body>
</html>



کد بالا کار می کند و مشکلی هم ندارد. الان من می خوان دو تا از این اسلاید ها در صفحه داشته باشم باید یکی اینکه div مربوطه رو تکرار کنم و دیگری اینکه باید کد jquery رو هم تکرار کنم. و id ها رو هم عوض کنم.
الان سوال من اینه که اگر بخوام تعداد تکرار متغیر باشه یعنی بر اساس عددی که تو دیتابیس نوشته شده کد jquery رو چطور باید تکرا کنم؟
ممنون
hamidreza-p
سه شنبه 06 مرداد 1394, 14:16 عصر
سلام.
از حلقه for استفاده کنید و در هر بار گذاشتن اسلایدر ، یک عدد به آی دی div و کد مربوطه اش توی JQUERY اضافه کنید.
mehdi4467
سه شنبه 06 مرداد 1394, 14:30 عصر
سلام.
از حلقه for استفاده کنید و در هر بار گذاشتن اسلایدر ، یک عدد به آی دی div و کد مربوطه اش توی JQUERY اضافه کنید.

ممنون
من برای حلقه های for مشکلی ندارم و چه در قسمت jquery و چه در قسمت div می تونم قرار بدم . منتها سوال من اینکه فرض کنید می خوام در قسمت jquery بگم حلقه for مثلا 10 بار اجرا بشه. این 10 رو که در متغیر php است چطوری به jquery پاس کنم؟
phpdev
سه شنبه 06 مرداد 1394, 15:03 عصر
یه امنتی رو با php پر کن مثلا یه p یا span رو با php پر کن و بعد با jquery بخونش . اینکه کاری نداره
rasoul_par
سه شنبه 06 مرداد 1394, 15:33 عصر
اصن میتونی کل div و jQuery رو توی یک for بزاری، مثل کد زیر:


<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8"> <title>jQuery UI Slider - Range slider</title> <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="http://code.jquery.com/jquery-1.10.2.js"></script> <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <link rel="stylesheet" href="/resources/demos/style.css"> <script> <?php for($i = 1; $i < 11; $i++): ?> $(function() { $( "#slider-range-<?= $i ?>" ).slider({ range: true, min: 0, max: 500, values: [ 75, 300 ], slide: function( event, ui ) { $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] ); } }); $( "#amount" ).val( "$" + $( "#slider-range-<?=$i ?>" ).slider( "values", 0 ) + " - $" + $( "#slider-range" ).slider( "values", 1 ) );
}); <?php endfor; ?>
</script> </head>
<body>
<p>
<label for="amount">Price range:</label>
<input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;">
</p>
<?php for($i = 1; $i < 11; $i++): ?> echo "<div id='slider-range-$i></div> ?> ?>
</body>
</html>
hamidreza-p
چهارشنبه 07 مرداد 1394, 00:55 صبح
ممنون
من برای حلقه های for مشکلی ندارم و چه در قسمت jquery و چه در قسمت div می تونم قرار بدم . منتها سوال من اینکه فرض کنید می خوام در قسمت jquery بگم حلقه for مثلا 10 بار اجرا بشه. این 10 رو که در متغیر php است چطوری به jquery پاس کنم؟
سلام.
نیازی نیست که متغیر پی اچ پی رو به جی کوئری پاس بدید !
شما با حلقه for قسمت مربوط به جی کوئری و div رو مثلاً ده بار چاپ کنید.
اینجوری :



<!doctype html><html lang="en"><head> <meta charset="utf-8">
<title>jQuery UI Slider - Range slider</title> <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="http://code.jquery.com/jquery-1.10.2.js"></script> <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <link rel="stylesheet" href="/resources/demos/style.css">
</head><body>
<?
for(i=0;i<10;i++) {
?>

<script> $(function() { $( "#slider-range<? echo i; ?>" ).slider({
range: true, min: 0, max: 500, values: [ 75, 300 ], slide: function( event, ui ) { $( "#amount<? echo i; ?>" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
} }); $( "#amount<? echo i; ?>" ).val( "$" + $( "#slider-range<? echo i; ?>" ).slider( "values", 0 ) +
" - $" + $( "#slider-range<? echo i; ?>" ).slider( "values", 1 ) );
}); </script>
<p>
<label for="amount<? echo i; ?>">Price range:</label>
<input type="text" id="amount<? echo i; ?>" readonly style="border:0; color:#f6931f; font-weight:bold;">
</p>

<div id="slider-range<? echo i; ?>"></div>


<? } ?>
</body></html>