JQuery உடன் பூட்ஸ்டார்ப் காலெண்டர்

பூட்ஸ்ட்ராப்-காலண்டர்

சுற்றிவரும் மகத்தான சமூகத்தால் நாம் பெருகிய முறையில் ஈர்க்கப்படுகிறோம் பூட்ஸ்டார்ப், நன்கு அறியப்பட்ட CSS கட்டமைப்பு , ட்விட்டரால் உருவாக்கப்பட்டது. இந்த நேரத்தில் நான் உங்களுக்கு பூட்ஸ்டார்ப் அடிப்படையிலான காலெண்டரை வழங்குகிறேன் ஜாவாஸ்கிரிப்ட் மற்றும் JQuery உடன் திட்டமிடப்பட்டதுகூடுதலாக, காலெண்டரின் செயல்பாட்டின் ஒரு பகுதியை நான் விரிவாக விளக்குவேன், மேலும் நீங்கள் செய்யக்கூடிய சில தந்திரங்களையும் மேம்பாடுகளையும் சேர்ப்பேன்.

இந்த பூட்ஸ்டார்ப் காலெண்டர் ஒரு சுத்தமான வடிவமைப்பைக் கொண்டுள்ளது மற்றும் முற்றிலும் உள்ளது பதிலளிக்க, இது எல்லா சாதனங்களிலிருந்தும் அழகாக இருக்கும்! இது ஒரு 7 க்கும் மேற்பட்ட மொழிகளில் மொழிபெயர்ப்பு மற்றும் அனைத்து ஒவ்வொரு நாட்டின் பண்டிகை தேதிகளும் சிறப்பிக்கப்பட்டு குறிப்பிடப்படுகின்றன. ஒரு ஆடம்பர!

இந்த பூட்ஸ்டார்ப் காலெண்டரின் செயல்பாடு சற்று சிக்கலானது, இது JSON கோப்பிலிருந்து பயனரின் தேதிகளை ஆரம்பத்தில் பிரித்தெடுக்கிறது, ஆனால், பிரத்தியேகமாக பயனர்களுக்கு Creativos Onlineஎப்படி என்பதை விளக்குகிறேன் ஒரு MYSQL தரவுத்தளத்திலிருந்து நிகழ்வுகளைப் பிரித்தெடுக்கவும் எந்தவொரு அமைப்பிலும் அதன் சரியான செயல்படுத்தலுக்காக.

அறியப்பட்ட தரவுத்தள அமைப்பு

அறியப்பட்ட தரவுத்தள அமைப்பு

பயன்பாட்டின் முக்கிய கோப்புகளின் செயல்பாடுகள்:

INDEX.HTML

  • பூட்ஸ்டார்ப் 2.3.2 ஏற்றுதல்
  • நாள்காட்டி வடிவமைப்பு
  • நிகழ்வுகளின் பட்டியல்
  • காலெண்டரை வழிநடத்துகிறது
  • வெவ்வேறு நாட்காட்டி காட்சிகள் (நாள் / வாரம் / மாதம் / ஆண்டு)
  • JS இல் பயன்பாட்டை ஏற்றுகிறது
  • மொழி தேர்வு

INDEX-BS3.HTML

  • பூட்ஸ்டார்ப் 3.0 ஏற்றுதல்
  • நாள்காட்டி வடிவமைப்பு
  • நிகழ்வு பட்டியல்
  • காலெண்டரை வழிநடத்துகிறது
  • வெவ்வேறு காலண்டர் காட்சிகள் (நாள் / வாரம் / மாதம் / ஆண்டு)
  • JS இல் பயன்பாட்டை ஏற்றுகிறது
  • மொழி தேர்வு

நிகழ்வுகள்.JSON.PHP

  • பின்வரும் தரவுகளுடன் நிகழ்வுகளின் பட்டியல்:
    • ஐடி: நிகழ்வு அடையாளங்காட்டி
    • தலைப்பு: நிகழ்வு தலைப்பு
    • URL: நிகழ்வு url
    • வர்க்கம்: அடுத்தடுத்த வண்ணங்களுக்கான நிகழ்வு வகை (தகவல் | எச்சரிக்கை |…).
    • தொடங்க: தொடக்க தேதி
    • முடிவு: முடித்த தேதி

APP.JS

  • பயன்பாட்டு உள்ளமைவை சேமிக்கும் மாறிகள்.
  • கூடுதல் JQuery செயல்பாடுகள்

காலண்டர்.ஜே.எஸ்

  • முக்கிய பயன்பாட்டு அமைப்புகள்
  • காலெண்டரின் முக்கிய செயல்பாடுகள்
  • நிகழ்வுகளின் பிரித்தெடுத்தல் மற்றும் சிகிச்சை
  • பண்டிகை தேதிகள்
  • மொழி ஏற்றுகிறது
  • நிகழ்வுகள் பட்டியலை ஏற்றுகிறது
  • வெவ்வேறு காலண்டர் காட்சிகளை ஏற்றுகிறது (நாள் / வாரம் / மாதம் / ஆண்டு)

CALENDAR.CSS

  • நாள்காட்டி பாங்குகள்
  • நிகழ்வு பட்டியல் பாணிகள்
  • பிற சாதனங்களுக்கான கேலெண்டர் பாணிகள்

தரவுத்தளத்திலிருந்து நிகழ்வுகளை பிரித்தெடுக்கவும்

ஒரு MYSQL தரவுத்தளத்திலிருந்து நிகழ்வுகளைப் பிரித்தெடுக்க கோப்பின் வரிகளை மாற்றுவோம் நிகழ்வுகள். json.php தயவு:

<?php

$link=mysql_connect("localhost", "usuariodeacceso", "contraseñadeacceso");
mysql_select_db("basededatos",$link) OR DIE ("Error: No es posible establecer la conexión");
mysql_set_charset('utf8');

$eventos=mysql_query("SELECT * FROM events'",$link);

while($all = mysql_fetch_assoc($eventos)){
$e = array();
$e['id'] = $all['id'];
$e['start'] = $all['inicio'];
$e['end'] = $all['final'];
$e['title'] = $all['nombre'];
$e['class'] = $all['clase'];
$e['url'] = $all['url'];
$result[] = $e;
}

echo json_encode(array('success' => 1, 'result' => $result));

?>

கிதுப் | பூட்ஸ்டார்ப் காலெண்டர்

பதிவிறக்க | பூட்ஸ்டார்ப் காலெண்டர்

மேலும் தகவல் | பூட்ஸ்டார்ப்: CSS கட்டமைப்பு


உங்கள் கருத்தை தெரிவிக்கவும்

உங்கள் மின்னஞ்சல் முகவரி வெளியிடப்பட்ட முடியாது. தேவையான புலங்கள் குறிக்கப்பட்டிருக்கும் *

*

*

  1. தரவுக்கு பொறுப்பு: மிகுவல் ஏஞ்சல் கேடன்
  2. தரவின் நோக்கம்: கட்டுப்பாட்டு ஸ்பேம், கருத்து மேலாண்மை.
  3. சட்டபூர்வமாக்கல்: உங்கள் ஒப்புதல்
  4. தரவின் தொடர்பு: சட்டபூர்வமான கடமையால் தவிர மூன்றாம் தரப்பினருக்கு தரவு தெரிவிக்கப்படாது.
  5. தரவு சேமிப்பு: ஆக்சென்டஸ் நெட்வொர்க்குகள் (EU) வழங்கிய தரவுத்தளம்
  6. உரிமைகள்: எந்த நேரத்திலும் உங்கள் தகவல்களை நீங்கள் கட்டுப்படுத்தலாம், மீட்டெடுக்கலாம் மற்றும் நீக்கலாம்.

  1.   டேவிட் இசட் அவர் கூறினார்

    நான் செர்ஜியோ குறியீட்டை சரிபார்க்கும்போது

    1.    செர்ஜியோ ரோடனாஸ் அவர் கூறினார்

      குறியீடு ஏற்கனவே சரிபார்க்கப்பட்டது! ஒரே விஷயம், உங்கள் தரவுத்தளத்தில் பின்வரும் நிகழ்வுகளுடன் அட்டவணை «நிகழ்வுகள் the அட்டவணையை உருவாக்க வேண்டும்: {id | வீடு | முடிவு | பெயர் | வகுப்பு | url} மற்றும் உங்கள் தரவுத்தளத்திற்கான அணுகலை உள்ளமைக்கவும்!

      1.    Ros அவர் கூறினார்

        மற்றவர்களுக்காக நான் அந்த மாறிகளை மாற்றியுள்ளேன், மேலும் நிகழ்வை எனது தரவுத்தளத்தில் சேர்க்க இது அனுமதித்துள்ளது, ஆனால் அது காலெண்டரில் பிரதிபலிப்பதை நான் காணவில்லை. நான் காலெண்டரைக் கிளிக் செய்யும் நாளைப் பொறுத்து நிகழ்வுகளின் தரவை எவ்வாறு மீட்டெடுப்பது?

  2.   jose luis zamudio (oseJoseZami) அவர் கூறினார்

    நிகழ்வுகளை உருவாக்குவதற்கும் செய்வதற்கும், ஒரு தரவுத்தளத்தை உருவாக்க வேண்டும், ஆனால் அது என்னவென்றால், நான் நிகழ்வுகளைச் சேர்க்க முடியும், இயல்புநிலையாக மொழி ஸ்பானிஷ் என்பதால் அது இயல்பாக ஆங்கிலமாக வரையறுக்கப்படுகிறது

    1.    செர்ஜியோ ரோடனாஸ் அவர் கூறினார்

      ஸ்பானிஷ் மொழியை இயல்புநிலையாக மாற்ற, ஸ்பானிஷ் மொழி கோப்பில் இருக்கும் சரங்களை காலெண்டர்.ஜெஸ் கோப்பில் ஆங்கிலத்தில் உள்ளவர்களுடன் மாற்றுவது நல்லது. இருப்பினும், பிற நேர்த்தியான முறைகள் உள்ளன, அவற்றை ஸ்கிரிப்டின் முக்கிய வலைத்தளத்திலோ அல்லது கிதுப் சமூகத்திலோ காணலாம், இந்த இடுகையில் இணைக்கப்பட்டுள்ளது.
      மேலும், சில வாரங்களில் ஒரு புதிய இடுகையை பதிவேற்ற முயற்சிப்பேன், அங்கு தரவுத்தளத்தில் நிகழ்வுகளின் செருகலை எவ்வாறு உருவாக்குவது என்பதை விளக்குகிறேன்.

  3.   jose luis zamudio (oseJoseZami) அவர் கூறினார்

    மிக்க நன்றி, நிகழ்வுகளைச் செருகுவதற்கான இடுகையைப் பாராட்டுகிறேன் :)

  4.   யாவீரின் அவர் கூறினார்

    வணக்கம் தரவுத்தளத்திலிருந்து எனது தரவை இணைக்க மற்றும் பிரித்தெடுக்க எல்லாவற்றையும் சரிசெய்யும்போது எனக்கு எந்த பிரச்சனையும் இல்லை

  5.   டியாகோ அவர் கூறினார்

    தரவுத்தளத்தில் நிகழ்வைச் செருகுவதில்லை

  6.   கோன்சா அவர் கூறினார்

    நிகழ்வுகளை எவ்வாறு செருகுவது என்பதை இடுகையிட முடியுமா? தொடக்க மற்றும் இறுதி புலங்களில் இது எந்த வகை தரவு? நேர முத்திரை? "0" மீதமுள்ளது, நான் செருக வேண்டும் மற்றும் நிகழ்வுகளைத் திருத்த முடியும். நன்றி

  7.   வியாழன் அவர் கூறினார்

    `பூட்ஸ்ட்ராப்_கலெண்டர்` / * இல்லாதிருந்தால் தரவுத்தளத்தை உருவாக்கவும்! 40100 செயலிழந்த தன்மை அமைவு utf8 COLLATE utf8_spanish_ci * /;
    `பூட்ஸ்ட்ராப்_ காலெண்டர்` பயன்படுத்தவும்;
    - Win10.13 (x5.6.13) க்கு MySQL டம்ப் 32 விநியோகம் 86
    -
    - புரவலன்: 127.0.0.1 தரவுத்தளம்: பூட்ஸ்ட்ராப்_கலெண்டர்
    - ——————————————————
    - சேவையக பதிப்பு 5.5.27

    / *! 40101 SET @OLD_CHARACTER_SET_CLIENT = @@ CHARACTER_SET_CLIENT * /;
    / *! 40101 SET @OLD_CHARACTER_SET_RESULTS = @@ CHARACTER_SET_RESULTS * /;
    / *! 40101 SET @OLD_COLLATION_CONNECTION = @@ COLLATION_CONNECTION * /;
    / *! 40101 செட் பெயர்கள் utf8 * /;
    / *! 40103 SET @OLD_TIME_ZONE = @@ TIME_ZONE * /;
    / *! 40103 SET TIME_ZONE = '+ 00:00 ′ * /;
    / *! 40014 SET @OLD_UNIQUE_CHECKS = @@ UNIQUE_CHECKS, UNIQUE_CHECKS = 0 * /;
    / *! 40014 SET @OLD_FOREIGN_KEY_CHECKS = @@ FOREIGN_KEY_CHECKS, FOREIGN_KEY_CHECKS = 0 * /;
    / *! 40101 SET @OLD_SQL_MODE = @@ SQL_MODE, SQL_MODE = 'NO_AUTO_VALUE_ON_ZERO' * /;
    / *! 40111 SET @OLD_SQL_NOTES = @@ SQL_NOTES, SQL_NOTES = 0 * /;

    -
    - அட்டவணை `நிகழ்வுகள்` க்கான அட்டவணை அமைப்பு
    -

    `நிகழ்வுகள்` இருந்தால் அட்டவணையை கைவிடவும்;
    / *! 40101 SET @saved_cs_client = @@ character_set_client * /;
    / *! 40101 SET character_set_client = utf8 * /;
    அட்டவணை `நிகழ்வுகளை` உருவாக்கவும் (
    `ஐடி` எண்ணாக (10) கையொப்பமிடப்படவில்லை NULL AUTO_INCREMENT,
    `தலைப்பு` வார்சார் (150) COLLATE utf8_spanish_ci DEFAULT NULL,
    `உடல்` உரை COLLATE utf8_spanish_ci NULL,
    `url` வார்சார் (150) COLLATE utf8_spanish_ci NULL,
    `வகுப்பு` வார்சார் (45) COLLATE utf8_spanish_ci NULL DEFAULT 'தகவல்',
    `தொடக்க` வார்சார் (15) COLLATE utf8_spanish_ci NULL,
    `முடிவு` வார்சார் (15) COLLATE utf8_spanish_ci NULL,
    முதன்மை கீ (`ஐடி`)
    ) ENGINE = InnoDB DEFAULT CHARSET = utf8 COLLATE = utf8_spanish_ci;
    / *! 40101 SET character_set_client = sasved_cs_client * /;

    -
    - அட்டவணை `நிகழ்வுகள்` க்கான தரவைக் குவித்தல்
    -

    பூட்டு அட்டவணைகள் `நிகழ்வுகள்` எழுது;
    / *! 40000 மாற்று அட்டவணை `நிகழ்வுகள்` முடக்கக்கூடிய விசைகள் * /;
    / *! 40000 மாற்று அட்டவணை `நிகழ்வுகள்` இயக்கக்கூடிய விசைகள் * /;
    அட்டவணைகளைத் திறக்கவும்;
    / *! 40103 SET TIME_ZONE = @ OLD_TIME_ZONE * /;

    / *! 40101 SET SQL_MODE = @ OLD_SQL_MODE * /;
    / *! 40014 SET FOREIGN_KEY_CHECKS = @ OLD_FOREIGN_KEY_CHECKS * /;
    / *! 40014 SET UNIQUE_CHECKS = @ OLD_UNIQUE_CHECKS * /;
    / *! 40101 SET CHARACTER_SET_CLIENT = @ OLD_CHARACTER_SET_CLIENT * /;
    / *! 40101 SET CHARACTER_SET_RESULTS = @ OLD_CHARACTER_SET_RESULTS * /;
    / *! 40101 SET COLLATION_CONNECTION = @ OLD_COLLATION_CONNECTION * /;
    / *! 40111 SET SQL_NOTES = @ OLD_SQL_NOTES * /;

    - 2014-05-31 14:38:23 அன்று டம்ப் முடிந்தது

  8.   juan77 அவர் கூறினார்

    ஹலோ மிகோஸ் JSON தேதி வடிவமைப்பை மாற்ற எந்த வழியும் இல்லை

  9.   கிசெலப்ரா அவர் கூறினார்

    காலெண்டர் மிகவும் நல்லது, ஒரு புதிய நிகழ்வை தொடக்கத்திலும் முடிவிலும் இயல்புநிலையாக எடுக்கும் தேதியை ஆங்கில வடிவத்தில் சேர்க்கும்போது மட்டுமே, அதை ஸ்பானிஷ் மொழியில் மாற்றுவது எப்படி? இது DD / MM / YYYY ஆக இருக்கும். மிக்க நன்றி மற்றும் வாழ்த்துக்கள்

  10.   ஃபேபியன் அவர் கூறினார்

    வணக்கம், காலெண்டர் மிகவும் நல்லது, ஆனால் ஒரு தேதியைப் புதுப்பிக்கும்போது அது உடனடியாக காலெண்டரில் பிரதிபலிக்காது. நான் என்ன செய்ய முடியும்?

    எனக்கு இன்னொரு சிக்கலும் உள்ளது, மாதாந்திர பார்வையில் எல்லா புள்ளிகளையும் எவ்வாறு காண்பிக்க முடியும், சதுரத்தை பெரிதாக்க முடியுமா? ஒரு நாளுக்கு என்ன ஒத்திருக்கிறது?

  11.   அலெக்ஸ் அவர் கூறினார்

    உதாரணத்தை ஏற்றும்போது உள்நாட்டில் அது சரியாக வேலை செய்யும் பிரச்சினை எனக்கு உள்ளது, ஆனால் நான் அதை ஒரு ஆன்லைன் சேவையகத்தில் பதிவேற்றும்போது அது காலெண்டரிலிருந்து எதையும் காட்டாது, பொத்தான்கள் மட்டுமே. தயவுசெய்து அதை சரிசெய்ய சேவையகத்தில் என்ன இருக்கலாம் அல்லது என்ன தவறு என்று எந்த யோசனையும்.