I have a project to print barcode in roll label like
this.
It is possible to do these things with tcpdf? At first the barcode should be placed at bottom and rotated 180° but i think its impossible to rotate the barcode using start transform and rotate since its only for graphic. So i tried to rotate the text, its works but only in another page to test that with dummy data. How to implement it in this code since im using serializeTCPDFtagParameters?
foreach($product as $row){
$description = $row['description'];
$barcode = $row['barcode_code'];
$barcode = $pdf->serializeTCPDFtagParameters(array($barcode, 'C128','','',25,10,0.5, array('position'=>'S','border'=>false,'padding'=>0, 'fgcolor'=>array(0,0,0), 'bgcolor'=>array(255,255,255), 'text'=>true, 'font'=>'helvetica','fontsize'=>7, 'stretchtext'=>6), 'N'));
$html .= '
<table width="60mm" height="15mm" cellpadding="3" border="1">
<tr>
<td><tcpdf method="write1DBarcode" params="'.$barcode.'" /></td>
</tr>';
'<tr>
<td> '.$description.'</td>
</tr>';
$html = '</table>';
$item = $item+1;}
$pdf->setFont('helvetica', '','4');
$pdf->writeHTML($html, true,0,true,0);
$pdf->lastPage();
$pdf->output('test.pdf','I');
And should i using cell to make the label side by side per table row? Im gonna use it for labeling jewelry and accessories. Is there any other alternative?
ps. Sorry for my poor english.
Related
I'm trying to output text + image + text in HAML. I know that I can do
=image_tag('some.png') + "text"
to have the text immediately after the picture. But how can I prepend some text?
="text" + image_tag('some.png') + "text"
does not work. What I get is
text
<img alt="" src="some.png" />text
which renders a blank between the first text and the image. I would rather like to have
text<img alt="" src="some.png" />text
My 2nd attempt above renders
text<img alt="" src="some.png" />text
Try this
view file:
%span
= "text".html_safe
= image_tag('/apple-icon-57x57.png')
= "text"
css file:
span img { display: inline; }
Sort of a solution was to render a new image with the texts and the image together. This way they always appear joined.
I have the following markup:
<paper-input id="alias-input" floatingLabel label="Person Alias (eg: King, Eldest Son, Mooch, etc.)"></paper-input>
<paper-input id="birth-year-input" floatingLabel label="Birth Year (eg: 1969)" validate="^[12][0-9][0-9][0-9]$"></paper-input>
<div center horizontal layout>
<paper-button id="add-button" on-click="{{addPerson}}" class="add" label="Add Person"></paper-button>
</div>
To go along with this markup I have an addButton method which does:
addPerson(_) {
// Add the person
// ...
// Clear the inputs
($['alias-input'] as PaperInput)..inputValue = ''..commit()..blur();
($['birth-year-input'] as PaperInput)..inputValue = ''..commit()..blur();
}
This correctly clears the contents of the inputs, which I want. But I also want the PaperInput help label to drop down onto the line as it is when the control is first loaded. My hope was that the call to blur() would do that. Is there some other call to achieve this?
It seems you need to call blur on the actual <input id='input'> element inside <paper-input> not the <paper-input> itself.
I got it working with
import 'dart:js' as js;
var inp = $['alias-input'] as PaperInput;
inp.inputValue = '';
new js.JsObject.fromBrowserObject(inp).callMethod('inputBlurAction', []);
alternatively you can do it like
var inp = $['alias-input'] as PaperInput;
inp.inputValue = '';
inp.querySelector('* /deep/ #input') // not yet supported with polyfills
..focus() // blur doesn't work when the field doesn't have the focus
..blur();
Scrolling a div that is within a .sortable() container will start dragging the div when you release the scrollbar
In the fiddle, there are 3 different sortables, 1 of them is a scrolling one
http://jsfiddle.net/wnHWH/1/
Bug: click on the scrollbar and drag it up or down to scroll through the content, when you release the mouse, the div starts to drag, which makes it follow your mouse around and there is no way to unstick it without refreshing the page.
You can use .mousemove event of jquery like this:
$('#sortable div').mousemove(function(e) {
width = $(this).width();
limit = width - 20;
if(e.offsetX < width && e.offsetX > limit)
$('#sortable').sortable("disable");
else
$('#sortable').sortable("enable");
});
I have create fiddle that works here http://jsfiddle.net/aanred/FNzEF/. Hope it meets your need.
sortable() can specify a selector for a handle much like draggable() does. Then only the matched elements get the click events. You specify the handle selector like this:
$('#sortable').sortable( {handle : '.handle'});
You already have most of what you need for the rest. The inner div on your overflowing element makes a suitable handle, like this:
<div style="height: 200px;overflow:auto">
<div class="handle" style="height: 300;">
blah
blah
blah
Then you need to restore the sortability of everything else. You'd think you could just give those divs the handle class, but it's looking for children, so you need to wrap all of them like so:
<div><div class="handle">asadf</div></div>
Modified fiddle
Supplement to SubRed's answer:
This worked perfectly for my needs. However, rather than rely on the width of the scrollbar being 20 pixels (as above), I used the code from:
How can I get the browser's scrollbar sizes?
This allows the code to handle different scrollbar widths on different setups. The code is pasted here for convenience:
function getScrollBarWidth ()
{
var inner = document.createElement('p');
inner.style.width = "100%";
inner.style.height = "200px";
var outer = document.createElement('div');
outer.style.position = "absolute";
outer.style.top = "0px";
outer.style.left = "0px";
outer.style.visibility = "hidden";
outer.style.width = "200px";
outer.style.height = "150px";
outer.style.overflow = "hidden";
outer.appendChild (inner);
document.body.appendChild (outer);
var w1 = inner.offsetWidth;
outer.style.overflow = 'scroll';
var w2 = inner.offsetWidth;
if (w1 == w2) w2 = outer.clientWidth;
document.body.removeChild (outer);
return (w1 - w2);
}
I've also used the width value for the height of the scrollbar and modified SubRed's code to suit. This now works with one or both scrollbars.
I also used code from:
Detecting presence of a scroll bar in a DIV using jQuery?
To determine the presence of either scroll bar and adapted the turning on/off of the sortable code accordingly.
Many thanks.
How can I retrieve the content of a specific cell in a TableSorter object ? Let say I want to retrieve the content of cell[3,4] meaning the content of the third row and fourth column. I'm sure there is an easy way to do that...
Thanks !
FG
According to the documentation TableSorter works on a standard table
Assuming this is your table
<table id='myTable'>
<tr>
<td>Row 0 / Cell 0</td>
<td>Row 0 / Cell 1</td>
</tr>
<tr>
<td>Row 1 / Cell 0</td>
<td>Row 1 / Cell 1</td>
</tr>
</table>
So you should be able to get a specific cell by getting a reference to your table
var myTable = document.getElementById('myTable');
Then access the specific cell by calling
var cell = myTable.rows[1].cells[0]
The contents of the cell should be accessible using
cell.firstChild.nodeValue; // returns "Row 1 / Cell 0"
I have a question for my foreach loop on a table design in my mvc view.
I want my loop to output max 2 cells for each table row and if and it has data to loop out more than 2 cells it adds a new row and continues to loop out the data on the cells on that row etc..
Anyone have a solution for this?
Iterate over the collection in increments of two. Check to make sure that the i+1th item is available before outputting it, outputting an empty cell instead if it isn't.
<table>
<thead>
<tr><th>Column 1</th><th>Column 2</th></tr>
</thead>
<tbody>
#for (int i = 0; i < Model.Count(); i = i + 2)
{
<tr>
<td>#Model[i]</td> // or #Model.ElementAt(i)
<td>#(i+1 < Model.Count() ? Model[i+1] : "")</td> // similar
</tr>
}
</tbody>
</table>
You shouldn't use tables for this.
Instead, put your content in <div>s with float: left or display: inline-block, and make the parent element just wide enough to hold two children.
You want to look at using the modulus operator (%).
Something like
if i%2 = 0 { new line }