Printing a "tag" with a barcode using reporting services and DB values in asp.net

Question

Edit 7 : I finally made it! Posted the answer.

Edit 6 : I scrapped the CSS and div and used a reporting services. Look at edits down the post to see where I am at right now.

I'm at a complete lost right now.
Sorry if I am not clear enough with my question, I can edit it to add information if needed. I'll try giving as much info as possible.
I've searched on google for hours now and havn't find anything to help me.

I am trying to create multiple "tag" using information on a user I have in my database and putting them on a page to print them. Plus, I need only 1 tag per page.
I got a stored proc that returns to me the username, name and family name as well as an ID I use to generate a barcode for every users in a certain event.

CREATE PROCEDURE Schema.GetAllTags
@IdEvent int
AS
BEGIN
    SELECT  Mem.Nom, Mem.Prenom, Mem.Pseudo, Use.IdUser
FROM    Schema.User Use
JOIN    Schema.Member Mem ON Use.IdMember = Mem.IdMember
WHERE   Use.IdEvent = @IdEvent
END

The barcode is generated by calling an asp page and giving it the ID I received from my stored proc in the page parameter. The asp page is an image that I use to show my barcode in other pages.

I tried making the tags using divs, CSS, asp content and all that stuff and it worked... except for the printing part. The tag being resized all the time, the margin not being an inch even tho I tried everything to make it 25.4mm (1 inch) and on top of it, the url of the page always showing in the preview print. All thoses problem could be solved by the client simply from unchecking the show url and setting the margin yourself in the options. But I don't want to force the client to do theses in order to fix the problem. I want it to be 3 by 2 in, with 1 in margin and no url without having to change printing options.

I was told using reporting services would solve my printing problems. But I have no clues how to make what I need out of reporting services (I know what reporting services are mind you)... even less on how to get my barcode in there.

Here what the tag should look like in the end on a print page. 3in x 2in with 1in margin on top and left when printing.

Here the CSS I used to try and print my tag :

<style type="text/css">
    @page
    {
        margin: 25.4mm 25.4mm 25.4mm 25.4mm;  
    }

    @media print 
    {
        body *  
        {
            visibility:hidden;
        }
        #tagPrint, #tagPrint * 
        {
            visibility:visible;
        }
        #tagPrint
        {
            position:fixed;
            top: 0px;
            left: 0px;
        }
        #NOPRINT
        {
            display:none;
        }
    }

And here the asp (That is for my page with only 1 tag showing) :

<asp:UpdatePanel ID="UpdatePanel1" runat="server" >
    <ContentTemplate>
        <div id="tag" class="formRow">
            <div id="tagPrint" style="border:1px solid;width:76.2mm;height:50.8mm">
                <p style="text-align:center" />
                <br />
                <asp:Label ID="lblUserTag" runat="server" style="font-weight:bold;font-size:18px" />
                <br />
                <asp:Label ID="lblFullNameTag" runat="server" style="font-weight:bold;font-size:16px" />
                <br />
                <br />
                <asp:Image ID="imgBarcodeTag" runat="server" />
                <br />
                <asp:Label ID="lblIdTag" runat="server" style="font-weight:bold;font-size:16px" />
            </div>
        </div>
        </ContentTemplate>
    </asp:UpdatePanel>

Currently generating my tags using a repeater on my page to generate multiple tags and binding the dataset.tables[0].Rows to the repeater. Allowing me to create thoses tags.

Is there any ways to do it without reporting services using only javascript and CSS? Is it doable with reporting services (Using an asp page in a reporting service to make a barcode)? Since my barcode come from a font, is there any other way then adding the font on the compiter in order to use it in reporting services? (I don't want the client to have to install the font) Would making a pdf of the tag easier/better?

Edit : Started working around with a report service. Right now I got the report made with 4 parameter. (Username, full name, barcode url and the ID) I'll give update on what happens next.

Edit 2 : So... after managing to make a report service and showing it in the page. I can't seem to get my image to show on the report. And even if I did. I don't know how to make multiple page on the report or how to print it. I decided to try making my Div Tag in PDF instead and try to print it that way. I'll update tomorrow when I get the chance to try it.

Edit 3 : Aside from wanting to smash my head on a wall several times, I tried doing it in PDF and it's not working. Found out it can probably be done in flash, but I do not want to do it in flash. So I'm back to the report service. I made a report service with a grid where I send my dataset to the grid and put the datas in each fields. I installed the font to be able to use it in the report. Now I can't seem to bind my dataset to the report. I tried an SqlDataSource and ObjectDataSource and nothing seems to work. I started another report in a new project to try from scrap. Maybe something from my current project is playing against me. I'm about to give up. -_-

Edit 4 : I finally made it to get something working. Got my report on my page working just fine.

Now only thing I have left to do... is manage to get the report to have multiple page.

Edit 5 : Rereading my edits and I realized I forgot to say that slightly after edit 2, I scrapped the parameters stuff and used a dataset instead. Also, I scrapped everything about CSS and the div to use a reporting service to save a PDF file of the tags.

Answer 1

Finally! I made it!

Here what I did.

1. Made a SSRS.
2. Made a report viewer and ObjectDataBinder
3. Create a DataSet for the SSRS using my stored proc.
4. Bound the report viewer to the SSRS.
5. Play around the SSRS to place the fields like they need to be placed.
6. Set page margin in SSRS to 1 inch. Set the report to 3x2 inch.
7. Set the report size to 5x4 inch.
8. Tested and enjoyed my victory over theses hours of frustration.

Note : It took me lot of time because visual studio bugged on me and I had to delete and redo my SSRS entirely.

Result :

A beautiful PDF file with perfect size, margin that print perfectly WITH a codebar. VICTORY!

Answer 2

So let me just preface this with a bit of explanation about SSRS: You're doing it all wrong.

By that I mean, if you're just trying to embed your ASP code and output in SSRS to achieve graphical fidelity, it's not going to happen.

The reason SSRS was recommended to you is because it can take a set of data and reproduce it with high graphic fidelity in a variety of reporting styles, formats, and output methods.

But you have to build it from scratch. No HTML, no CSS, no ASP, no .Net (well .. sort of. For you, yes, no .Net required.)

Whoa, whoa, whoa, where you going? It's not that hard, I promise.

So ... first, let's just set up a task list for you to do this in SSRS. Before we can even do that, let's just build a wizard-driven report so we can get your ID tag data set into the report. It'll give you a basic feel for how SSRS consumes data and turns it into a report.

1. Create a brand-new Reporting Services project.
2. Add a new report to this project. In the Solution Explorer, right click on the Reports folder and "Add New Report."
3. Step one is select the data source. Hook it up to your database with the stored procedure you're running, test your connection, moving on.
4. Next step is to Design the Query - but you've already done that with your Sproc, so just paste that in - for now, add a hardcoded value for your IdEvent. We'll fix that later.
5. Now choose your report type - let's just do Tabular for now. Matrix is more for lots of row/column dynamics, and you're just looking for a simple printable report, so table for you.
6. Now in designing the table, just add all of your output columns to the Detils group.
7. Choose any old Table style, you're throwing this all away in the end.
8. Name your report something useful and finish.

Now you've got a RDL, it's got a data source, a data set, and some code in the designer area. You can preview what you've done so far by clicking the "Preview" tab in the designer area. Pretty sweet, there's all your data, in little rows in a table. Now what?

Now for the task list. Start Googling, you can learn all of this, it won't take too long, and when you're done, you'll have a well-formatted set of ID tags ready for the printer. And if you run into specific issues - well, that's what this site is for, right?

1. Create a parameter to pass in your IDEvent to your stored procedure.
2. Insert a dynamic external image into the row that retrieves the barcode from your ASP page. (Hint: read up on using "Expressions" in SSRS.)
3. Figure out how to use the page break options in SSRS to only print 1 tag per page.
4. Use the properties window to format each "row" of your table to look like your tag.
5. Figure out whether to export your report as a PDF, or just use the MHTML version provided.

You might also potentially want to learn how to embed an SSRS report in a .Net application (how are you clients printing the tags, anyway?) And of course there are tons of little methods, properties, and aspects of SSRS that are out of scope for this particular task but might be worth at least taking a look at for later projects.

Good luck!