Disable other checkbox-es if one is checked

If you have to make some kind of validation where if one checkbox is checked there other should not be able to be checked or if you check a specific one the others or some other specific ones should be disabled then you can do this with some simple Javascript / jQuery

These fields that we want to control have an id and also a more specific name, but just in my case you of course can change it as you want/need.

<div class=”col-lg-8 data” style=”height: 270px;”>
<div class=”checkbox”>
<label>
<input name=”name”  value=”1″ checked=”” class=”someclass” id=”first” type=”checkbox”>
first      </label>
</div>

<div class=”checkbox”>
<label>
<input name=”name” value=”2″ class=”someclass” id=”second” type=”checkbox”>
second      </label>
</div>

<div class=”checkbox”>
<label>
<input name=”name” value=”3″ class=”someclass” type=”checkbox”>
something       </label>
</div>

<div class=”checkbox”>
<label><input name=”name” value=”4″ class=”someclass” type=”checkbox”>
something      </label>
</div>

<div class=”checkbox”>
<label><input name=”name” value=”5″ class=”someclass” type=”checkbox”>
something       </label>
</div>
<div class=”checkbox”>
<label><input name=”name” value=”6″ class=”someclass” id=”fourth” type=”checkbox”>
fourth        </label>
</div>

<div class=”checkbox”>
<label><input name=”name” value=”29″ class=”someclass” id=”fifth” type=”checkbox”>
fifth      </label>
</div>

<div class=”checkbox”>
<label>
<input name=”name” value=”11″ class=”someclass” type=”checkbox”>
something       </label>

</div>

<div class=”checkbox”>
<label><input name=”name” value=”7″ class=”someclass” type=”checkbox”>
something       </label>
</div>

</div>
</div>

in this example we are disabling the fourth and fifth fields if either the first or the second fields are checked or we check them. or vise versa as well if the fourth or the fifth fields are checked we are disabling the first and second fields.

$( document ).ready(function() {
if($(‘#first, #second’).is(“:checked”)){
$(‘#fourth’).attr(‘disabled’, true);
$(‘#fifth’).attr(‘disabled’, true);
} else if ($(‘#fourth, #fifth’).is(“:checked”)){
$(‘#first’).attr(‘disabled’, true);
$(‘#second’).attr(‘disabled’, true);
}
});

$(‘#first, #second’).change(function () {
if ($(this).is(“:checked”)) {
$(‘#fourth’).attr(‘disabled’, true);
$(‘#fifth’).attr(‘disabled’, true);
} else if($(‘#first, #second’).is(“:checked”)){
$(‘#fourth’).attr(‘disabled’, true);
$(‘#fifth’).attr(‘disabled’, true);
}
else {
$(‘#fourth’).attr(‘disabled’, false);
$(‘#fifth’).attr(‘disabled’, false);
}
});

//check if fourth is checked disable first
$(‘#fourth, #fifth’).change(function () {
if ($(this).is(“:checked”)) {
$(‘#first’).attr(‘disabled’, true);
$(‘#second’).attr(‘disabled’, true);
} else if ($(‘#fourth, #fifth’).is(“:checked”)){
$(‘#first’).attr(‘disabled’, true);
$(‘#second’).attr(‘disabled’, true);
}
else {
$(‘#first’).attr(‘disabled’, false);
$(‘#second’).attr(‘disabled’, false);
}
});

Export table to PDF and other formats with Javascript using tableExport.jquery.plugin

In this Article I’ll show you how to export tables using a js plugin called tableExport.jquery.plugin wich you can download from github.

this plugin allows you to download or export in various formats such as: CSV, DOC, JSON, PDF, PNG, SQL, TSV, TXT, XLS (Excel 2000 HTML format), XLSX (Excel 2007 Office Open XML format), XML (Excel 2003 XML Spreadsheet format), XML (Raw xml).

the installation is fairly simple import the scripts on your website like

To save the generated export files on client side, include in your html code:

<script type="text/javascript" src="libs/FileSaver/FileSaver.min.js"></script>

To export the table in XLSX (Excel 2007+ XML Format) format, you need to include additionally:

<script type="text/javascript" src="libs/js-xlsx/xlsx.core.min.js"></script>

To export the table as a PDF file the following includes are required:

<script type="text/javascript" src="libs/jsPDF/jspdf.min.js"></script>
<script type="text/javascript" src="libs/jsPDF-AutoTable/jspdf.plugin.autotable.js"></script>

To export the table in PNG format, you need to include:

<script type="text/javascript" src="libs/html2canvas/html2canvas.min.js"></script>

Regardless of the desired format, finally include:

<script type="text/javascript" src="tableExport.min.js"></script>

lease keep this include order.

Dependencies

Library Version
jQuery >= 1.9.1
FileSaver >= 1.2.0
html2canvas >= 0.5.0-beta4
jsPDF 1.1.239 or 1.3.2
jsPDF-AutoTable 2.0.14 or 2.0.17

Examples

// CSV format

$('#tableID').tableExport({type:'csv'});
// Excel 2000 html format

$('#tableID').tableExport({type:'excel'});
// XML Spreadsheet 2003 file format with multiple worksheet support

$('table').tableExport({type:'excel',
                        excelFileFormat:'xmlss',
                        worksheetName: ['Table 1','Table 2', 'Table 3']});
// PDF export using jsPDF only

$('#tableID').tableExport({type:'pdf',
                           jspdf: {orientation: 'p',
                                   margins: {left:20, top:10},
                                   autotable: false}
                          });
// PDF format using jsPDF and jsPDF Autotable 

$('#tableID').tableExport({type:'pdf',
                           jspdf: {orientation: 'l',
                                   format: 'a3',
                                   margins: {left:10, right:10, top:20, bottom:20},
                                   autotable: {styles: {fillColor: 'inherit', 
                                                        textColor: 'inherit'},
                                               tableWidth: 'auto'}
                                  }
                          });
// PDF format with callback example

function DoCellData(cell, row, col, data) {}
function DoBeforeAutotable(table, headers, rows, AutotableSettings) {}

$('table').tableExport({fileName: sFileName,
                        type: 'pdf',
                        jspdf: {format: 'bestfit',
                                margins: {left:20, right:10, top:20, bottom:20},
                                autotable: {styles: {overflow: 'linebreak'},
                                            tableWidth: 'wrap',
                                            tableExport: {onBeforeAutotable: DoBeforeAutotable,
                                                          onCellData: DoCellData}}}
                       });

Options (Default settings)

consoleLog: false
csvEnclosure: '"'
csvSeparator: ','
csvUseBOM: true
displayTableName: false
escape: false
excelRTL: false
excelstyles: []
excelFileFormat: 'xlshtml'
fileName: 'tableExport'
htmlContent: false
ignoreColumn: []
ignoreRow: []
jsonScope: 'all'
jspdf: orientation: 'p'
       unit:'pt'
       format: 'a4'
       margins: left: 20
                right: 10
                top: 10
                bottom: 10
       onDocCreated: null
       autotable: styles: cellPadding: 2
                          rowHeight: 12
                          fontSize: 8
                          fillColor: 255
                          textColor: 50
                          fontStyle: 'normal'
                          overflow: 'ellipsize'
                          halign: 'left'
                          valign: 'middle'
                  headerStyles: fillColor: [52, 73, 94]
                                textColor: 255
                                fontStyle: 'bold'
                                halign: 'center'
                  alternateRowStyles: fillColor: 245
                  tableExport: doc: null
                               onAfterAutotable: null
                               onBeforeAutotable: null
                               onAutotableText: null
                               onTable: null
                               outputImages: true
numbers: html: decimalMark: '.'
               thousandsSeparator: ','
         output: decimalMark: '.',
                 thousandsSeparator: ','
onCellData: null
onCellHtmlData: null
onIgnoreRow: null
onMsoNumberFormat: null
outputMode: 'file'
pdfmake: enabled: false
         docDefinition: pageOrientation: 'portrait'
                        defaultStyle: font: 'Roboto'
         fonts: {}
tbodySelector: 'tr'
tfootSelector: 'tr'
theadSelector: 'tr'
tableName: 'myTableName'
type: 'csv'
worksheetName: 'WorksheetName'

ignoreColumn can be either an array of indexes (i.e. [0, 2]) or field names (i.e. [“id”, “name”]).

  • Indexes correspond to the position of the header elements th in the DOM starting at 0. (If the th elements are removed or added to the DOM, the indexes will be shifted so use the functionality wisely!)
  • Field names should correspond to the values set on the “data-field” attribute of the header elements th in the DOM.
  • “Nameless” columns without data-field attribute will be named by their index number (converted to a string)

To disable formatting of numbers in the exported output, which can be useful for csv and excel format, set the option numbers: output to false.

Set the option excelFileFormat to 'xmlss' if you want to export in XML Spreadsheet 2003 file format. Use this format if multiple tables should be exported into a single file. Excel 2000 html format is the default excel file format which has better support of exporting table styles.

The excelstyles option lets you define the css attributes of the original html table cells, that should be taken over when exporting to an excel worksheet (Excel 2000 html format only).

To export in XSLX format protobi/js-xlsx forked from SheetJS/js-xlsx is used. Please note that the implementation of this format type lets you only export table data, but not any styling information of the html table.

For jspdf options see the documentation of jsPDF and jsPDF-AutoTable resp.

There is an extended setting for jsPDF option 'format'. Setting the option value to 'bestfit' lets the tableExport plugin try to choose the minimum required paper format and orientation in which the table (or tables in multitable mode) completely fits without column adjustment.

Also there is an extended setting for the jsPDF-AutoTable options 'fillColor', 'textColor' and 'fontStyle'. When setting these option values to 'inherit' the original css values for background and text color will be used as fill and text color while exporting to pdf. A css font-weight >= 700 results in a bold fontStyle and the italic css font-style will be used as italic fontStyle.

When exporting to pdf the option outputImages lets you enable or disable the output of images that are located in the original html table.

Optional html data attributes

(can be applied while generating the table that you want to export)

data-tableexport-cellformat

<td data-tableexport-cellformat="">...</td> -> An empty data value preserves format of cell content. E.g. no number seperator conversion
                                               
                                               More cell formats to be come...

data-tableexport-display

<table style="display:none;" data-tableexport-display="always">...</table> -> A hidden table will be exported

<td style="display:none;" data-tableexport-display="always">...</td> -> A hidden cell will be exported

<td data-tableexport-display="none">...</td> -> This cell will not be exported

<tr data-tableexport-display="none">...</tr> -> All cells of this row will not be exported

data-tableexport-msonumberformat

<td data-tableexport-msonumberformat="@">...</td> -> Data value will be used to style excel cells with mso-number-format (Excel 2000 html format only)
                                                      Examples:
                                                      "@"       excel treats cell content alway as text, even numbers
                                                      "0"        excel will display no decimals for numbers
                                                      "0.000"   excel displays numbers with 3 decimals
                                                      "0%"       excel will display a number as percent with no decimals
                                                      "Percent"  excel will display a number as percent with 2 decimals

data-tableexport-value

<th data-tableexport-value=export title>title</th> -> “export title” instead of “title” will be exported <td data-tableexport-value=export content>content</td> -> “export content” instead of “content” will be exported

Thanks to hhurz for forking the original project and enabling us to do more with the plugin.

My experiance

What I’ve done is in a laravel project is this. First of all I’ve added a button. like this:

<button type="button"
             class="btn btn-default btn-xs pull-left mr-1 export_to_pdf"
             id="export_to_pdf"
             value="table-{{ $institution->InstitutionId .'-'. $periodIndex }}"
             onClick="$('#table-{{ $institution->InstitutionId }}').tableExport({type:'pdf',
                     ignoreColumn: [14],
                     jspdf: {orientation: 'l',
                     format: 'a4',
                     margins: {left:10, right:10, top:20, bottom:20},
                     autotable: {styles: {fillColor: 'inherit',
                     textColor: 'inherit'},
                     tableWidth: 'auto'}
                     }
                     });"
    >
        Export to PDF
    </button>
This button had some bootstrap classes and Id and a value with was kinda the id of the table it represents after this I've added a onClick function with the table Id wich I names #table - and the table id in case there are more tables showing on this page and I need to export just the one I needed or the button represented.
Then I've added the tableExport function wich did the fundamental job to export to pdf. i ignored the column 14 with an array, the orientation was landscape, the document format an A4, some margins, and some styles.

The table had some bootstrap classes, an id with the table id.
<table class="table table-striped table-hover" id="table-{{ $institution->InstitutionId }}">

hope that helps you.

Change an input field using a url get request with parameters

What it really means is we are pressing an button which sends an argument threw the URL and based on the URL we change a drop-down list.

So for example we have a button like this

<a class=”Button” href=”/another-page/?field8_4=1″>Button</a>

This button goes to a page and sends 2 arguments the field8_4 and the field number i this case the first (1).

The script in the other hand just takes this information and changes the drop-down field based on the argument.

<script>
jQuery(‘#field8_4’).ready(function(){
var params = window.location.search.substr(1).split(‘=’);
if(params.length > 1){

jQuery(‘#fscf_field8_4 option[value=”‘ + params[1] +'”]’).attr(‘selected’, ‘selected’);
}
});
</script>

so it looks for the field8_4 then, get a “params” variable where it stores the location of the subscript and splits it with the “=” sign.

The if statement just makes sure that there are more then one parameter sent, and if so get the value of the params and select the field based on the param.

Unsicherheit ein instrument der Selbstzerstörung

Unsicherheit in der pre-bezihung oder werden des dating processes, kann eine eigentlich gesunde Beziehung zum abbrauch bringen. Wenn man unsicher mit sich selbst ist oder

 

 

Alle Menner/Frauen für die ich was empfinde verlasen mich schließlich

Man vertraut an das gute im Menschen nicht mehr. Man wurde einfach so stehen gelassen oder führte eine missbräuchliche Beziehung. Was dann mit einem passiert ist mann verliert das vertrauen.

Generate a link dynamically

If you have a form or whatever where you need to call a uri you can do it dynamically with the action Methode.
 lets imagine we have a form and we need the action of the form to go to a certain uri we could add the url to the root like this:

action=”/donor/{{ auth()->guard(‘donor’)->id() }}/profile/changePassword”

in this case the uri is simple to donor/ {{ the autheticated donor with the id }}and then profile/changePassowrd. But that would be static and if something changes this root would not work anymore so what we are doing is:

{{ action(‘DonorsDonorController@updatePassword’, [auth()->guard(‘donor’)->id() ]) }}

so this get’s us the same result, but if something changes we are still good.

<form class=”form-horizontal” action=”{{ action(‘DonorsDonorController@updatePassword’, [auth()->guard(‘donor’)->id() ]) }}” method=”POST” role=”form”>

Working with cookies Laravel

Laravel version 5.5

This article explains how to save cookie data to a browser and show them to the fronted.

The controller – in our example we’ll show to to get a variable value and store it immediately to a cookie with a given name.

First things first get the cookie functionality we’ll need to import the  cookie facades and the cookieJar, at the top of your controller outside the class declaration, we’ll write:

use IlluminateCookieCookieJar;
use IlluminateSupportFacadesCookie;

at the function declaration we send in the cookieJar, which looks like this:

public function example(CookieJar $cookieJar)
{

in that fuction depending on what we’re doing with the function and what it returns we store the cookie like this:

Cookie::queue(Cookie::make('SOME_NAME', $VARIABLE_NAME, 3000));

where SOME_NAME is the name of the cookie wich will be shown on the browser, and $variable_name the variable name of course which you want to store in the cookie.

coockie

After the cookie is saved there is just one think left, showing it on the fronted. using blade:

{{ Cookie::get('SOME_NAME') }}

Where SOME_NAME is the cookie name we declared while saving it from the controller.

Show database results on all pages using view composer

To demonstrate how to show database results on all views using of course view composer we’ll do a simple counter in our application. What that counter does is increments every time a specific form is submitted. let’s immediately get to it.

  1. we’ll need a migration file to do this we open our command window or Terminal that points of course to the application root and write:

php artisan make:migration test_Counters

on that migration file we’ll add what we want to do with it (dont forget to add the blow code to public function up(){) so in this case:

Schema::create('test_Counters', function (Blueprint $table) {
    $table->bigInteger('test_counter');
});

as you can see the Schema is very simple your can be much more complicated depending on what you want to do. don’t forget you have to do a:

php artisan migrate:refresh

to make sure you database is polluted, in this case you even have to add the first number to that database column you added with the schema.

2.  we’ll need a model, to make a model we simple add one again using our terminal and write:

php artisan make:model TestCounter

in my case we don’t have to write anything in it.

3. the Controller. You can create one or you can use an existing one where the submit button is going so in my case it’s TestController.php we’ll add the following code to it:

DB::table('test_counters')->increment('test_counter');

what this code does is go to the test_counters on the database and increments the test_counter column by one.  don’t forget to call:

use DB;

at the top of the controller in order to use the DB fasade

4. Providers, your AppServiceProvider.php file lets you to execute the code you want on all views.  so on the public function boot() methode you’ll need to add this:

View::composer('*', function($view){
    $view->with('counter', testCounter::first());

});

What that code does is simply says allow the counter to be shown on all views.

5. show it, To show the results of our little counter we go to the app.blade.php page so the main layout page. All you have to do is add this to a place you want to show your results.

{{ $counter->test_counter }}

That’s it. now you can enjoy your counter.

Fix “Syntax error or access violation: 1071 Specified key was too long;”

Laravel 5.4 made a change to the default database character set, and it’s now utf8mb4 which includes support for storing emojis. This only affects new applications and as long as you are running MySQL v5.7.7 and higher you do not need to do anything.

For those running MariaDB or older versions of MySQL you may hit this error when trying to run migrations:

[IlluminateDatabaseQueryException]
SQLSTATE[42000]: Syntax error or access violation: 1071 Specified key was too long; max key length is 767 bytes (SQL: alter table users add unique users_email_unique(email))

[PDOException]
SQLSTATE[42000]: Syntax error or access violation: 1071 Specified key was too long; max key length is 767 bytes

As outlined in the Migrations guide to fix this all you have to do is edit your AppServiceProvider.php file and inside the boot method set a default string length:

use IlluminateSupportFacadesSchema;

public function boot()
{
    Schema::defaultStringLength(191);
}

After that everything should work as normal.